Javascript 需要创建一个展开的目录

Javascript 需要创建一个展开的目录,javascript,menu,tableofcontents,Javascript,Menu,Tableofcontents,我是一名编程初学者,并且被分配了一个课程项目。我需要为脚本创建一个目录。必须有“反向链接”。我有这一部分,但当我试图做第二部分:使行为可以扩展,以看到章节,这是链接,我遇到了麻烦。我没有任何javascrript知识,也不知道从这里到哪里去。。。这就是我到目前为止所做的: <dl> <dt><span onclick="showHide(this)">Act One</span></dt> <dd

我是一名编程初学者,并且被分配了一个课程项目。我需要为脚本创建一个目录。必须有“反向链接”。我有这一部分,但当我试图做第二部分:使行为可以扩展,以看到章节,这是链接,我遇到了麻烦。我没有任何javascrript知识,也不知道从这里到哪里去。。。这就是我到目前为止所做的:

<dl>
     <dt><span onclick="showHide(this)">Act One</span></dt>
           <dd style="display: none"><ul><li><a href="#chapter_toc1" id="chapter1">Chapter I - Subservient Twilight</a></li>
           <li><a href="#chapter_toc39" id="chapter39">Chapter II - Cat Handler</a></li>
           <li><a href="#chapter_toc151" id="chapter151">Chapter III - Tutorial</a></li>
           <li><a href="#chapter_toc172" id="chapter172">Chapter IV - Journey Into Faron Woods</a></li>
           <li><a href="#chapter_toc207" id="chapter207">Chapter V - Faron Descends In to Twilight</a></li></ul></dd>

     <dt><span onclick="showHide(this)">Act Two</span></dt>
           <dd style="display: none"><ul><li><a href="#chapter_toc272" id="chapter272">Chapter I - The World of Ruin</a></li>
           <li><a href="#chapter_toc306" id="chapter306">Chapter II - Sword and Shield</a></li>
           <li><a href="#chapter_toc357" id="chapter357">Chapter III - Chosen Hero of the Gods</a></li>
           <li><a href="#chapter_toc398" id="chapter398">Chapter IV - The Forest Temple</a></li></ul></dd>

     <dt><span onclick="showHide(this)">Act Three</span><dt>
           <dd style="display: none"><ul><li><a href="#chapter_toc429" id="chapter429">Chapter I - Servant of Twilight</a></li>
           <li><a href="#chapter_toc444" id="chapter444">Chapter II - Forgotten Hero</a></li>
           <li><a href="#chapter_toc500" id="chapter500">Chapter III - Sumo Wrestling</a></li>
           <li><a href="#chapter_toc607" id="chapter607">Chapter IV - The Passage Into Death Mountain</a></li>
           <li><a href="#chapter_toc721" id="chapter721">Chapter V - Goron Mines</a></li></ul></dd>

     <dt><span onclick="showHide(this)">Act Four</span></dt>
           <dd style="display: none"><ul><li><a href="#chapter_toc775" id="chapter775">Chapter I - Castle Under Siege</a></li>
           <li><a href="#chapter_toc814" id="chapter814">Chapter II - Serenade of Water</a></li>
           <li><a href="#chapter_toc861" id="chapter861">Chapter III - Under the Great Bridge of Hylia</a></li>
           <li><a href="#chapter_toc896" id="chapter896">Chapter IV - Flight to Kakariko</a></li>
           <li><a href="#chapter_toc1009" id="chapter1009">Chapter V - Lakebed Temple</a></li></ul></dd>

        <dt><span onclick="showHide(this)">Act Five</span><dt>
           <dd style="display: none"><ul><li><a href="#chapter_toc1044" id="chapter1044">Chapter I - Midna's Desperate Hour</a></li>
           <li><a href="#chapter_toc1115" id="chapter1115">Chapter II - The Blade of Evil's Bane</a></li>
           <li><a href="#chapter_toc1120" id="chapter1120">Chapter III - Mirage of the Ancient Gerudo</a></li>
           <li><a href="#chapter_toc1176" id="chapter1176">Chapter IV - Arbiter's Grounds</a></li></ul></dd>

     <dt><span onclick="showHide(this)">Act Six</span></dt>
           <dd style="display: none"><ul>
           <li><a href="#chapter_toc1211" id="chapter1211">Chapter I - Yetis and Soup</a></li>
           <li><a href="#chapter_toc1288" id="chapter1288">Chapter II - Snowpeak Ruins</a></li>
           <li><a href="#chapter_toc1309" id="chapter1309">Chapter III - Temple of Time</a></li></ul></dd>

     <dt><span onclick="showHide(this)">Act Seven</span></dt>
           <dd style="display: none"><ul><li><a href="#chapter_toc1337" id="chapter1337">Chapter I - Fractured Memories</a></li>
           <li><a href="#chapter_toc1466" id="chapter1466">Chapter II - Hidden Village of the Shadow Tribe</a></li>
           <li><a href="#chapter_toc1523" id="chapter1523">Chapter III - Cannon Ride to the Stars</a></li>
           <li><a href="#chapter_toc1549" id="chapter1549">Chapter IV - City in the Sky</a></li></ul></dd>

     <dt><span onclick="showHide(this)">Act Eight</span></dt>
           <dd style="display: none"><ul><li><a href="#chapter_toc1558" id="chapter1558">Chapter I - Palace of Twilight</a></li>
           <li><a href="#chapter_toc1611" id="chapter1611">Chapter II - Of Worlds Left Behind</a></li></ul></dd>

第一幕
第二幕
第三幕
第四幕
第五幕
第六幕
第七幕
第八幕

您的代码不显示任何
showHide
功能。你所需要做的就是创建它。它可能看起来像这样:

<script>
    function showHide(actElement) {
        var current = actElement.firstChild.style.display;
        if (current == "none") {
            actElement.firstChild.style.display = "block";
        } else {
            actElement.firstChild.style.display = "none";
        }
    }
</script>

函数showHide(actElement){
var current=actElement.firstChild.style.display;
如果(当前=“无”){
actElement.firstChild.style.display=“块”;
}否则{
actElement.firstChild.style.display=“无”;
}
}
有几种具有相同功能的较短的编写方法,例如:

<script>
    function showHide(actElement) {
        actElement.firstChild.style.display = (actElement.firstChild.style.display == "block") ? "none" : "block";
    }
</script>

函数showHide(actElement){
actElement.firstChild.style.display=(actElement.firstChild.style.display=“块”)?“无”:“块”;
}

这是完全一样的,但更简洁。

现在我的李是ul的孩子。。。。就在dd之后。但这会不会导致我的点击功能不起作用?可能不会;但很抱歉,我没有看到
标签。没关系。谢谢你的关注!当然,请记住,如果您使用第二个示例中的三元运算符,您的老师可能会知道您没有编写代码,尽管您没有编码经验;)我该把这个放在哪里?我是否需要在我的HTML中包含它(如果需要,在哪里?在头部,在它将使用的部分下?)或者我必须将它关联起来?非常感谢@厌倦带来了一个好的观点——你的老师不能期望你在没有教你基本知识的情况下了解javascript。最简单的答案是将其放入HTML的
,不过随着您了解更多,您会发现您可以将内容放入正文中,和/或将其保存为外部文件。谢谢!这帮了大忙。:)