Question

我正在尝试制作一段代码，通过点击链接来更改我的网页内容。它隐藏了现在显示的div并将其替换为另一个。

html是这样的：

        <ul>
                    <li> <a href="#" id="Overview_button"  >  Overview                          </a> </li>
                    <li> <a href="javascript:changeContent('Backgrounds');">                                Backgrounds</a></li>
                    <li><a href="#" id="Boxes_button">   Boxes</a>                          </li>
                    <li><a href="#" id="Colors" >   Colors</a>                          </li>
                    <li> <a href="#" id="Navigation_button">                                Navigation</a></li>
                    <li> <a href="#" id="Positining_button">                                Positioning</a></li>
                    <li> <a href="#" id="Text_button">  Text</a>                                </li>
                    <li> <a href="#">                               Conclusion </a></li>
                </ul>

现在该函数仅应用于第二个元素，因为那是我正在测试的那个元素。 id＆＃39;背景＆＃39;指的是文本后面的div。

javascript是：

var currentContent = 'Overview';

function changeContent(newContent) {
document.getElementById(currentContent).style.display = "none";
document.getElementByID(newContent).style.display = "block";
currentContent = newContent;
};

它成功地隐藏了旧内容，但没有显示新内容。

Answer 1

的document.getElementById

应该是

document.getElementById

无论如何，您应该在发布此类问题之前检查控制台中的错误。

Css属性不变（javascript）

1 个答案: