Question

我需要确认！

我正在尝试将内容从一个元素换成另一个包含HTML标记的元素。当我说下面的代码应该有效时，我很确定我是正确的。我需要知道我是否正确，因为如果这不起作用的原因是我认为的那样，我还需要创建一些额外的功能。

请确认这是对还是错：

function subNavContent ( ) {  

    var navContent = document.getElementsByClassName( 'pageNav' ).innerHTML;

    document.getElementById( 'subNav' ).innerHTML = navContent;}

来自：

<div class="pageNav">
    <h1 data-title="Welcome to The Mind Company"><a>Welcome</a></h1>
</div>

发送至：

    <nav id="subNav" class="aniSubNavOpen drop-shadow lifted">
    </nav>

Answer 1

这是错的。

似乎.innerHTML在内部是某种setter，这意味着，在复制引用时你会丢失Context（至少在FF12中）。

这将有效：

document.getElementById( 'subNav' ).innerHTML = navContent;

Answer 2

NavSub是innerHTML的文本。让navSub成为对象然后navSub.innerhtml = ...（对不起使用帽子，我在手机上）。评论如果你不理解我的意思。

Answer 3

当你执行这两行时：

var navSub = document.getElementById( 'subNav' ).innerHTML;
var navContent = document.getElementsByClassName( 'pageNav' )[0].innerHTML;

您将从这两个对象获取HTML文本并将其存储在两个变量中。您现在有两个常规的javascript变量，每个变量都包含一个字符串。

然后你这样做：

navSub = navContent;

您只是将navContent字符串分配给navSub javascript变量。它不会以任何方式影响DOM。这些只是两个字符串变量。

如果要更改DOM中navSub对象的内容，可以执行以下操作：

var navSubObj = document.getElementById( 'subNav' );
var navContent = document.getElementsByClassName( 'pageNav' )[0].innerHTML;
navSubObj.innerHTML = navContent;

另外，请注意我必须更改此内容：

var navContent = document.getElementsByClassName( 'pageNav' ).innerHTML;

到此：

var navContent = document.getElementsByClassName( 'pageNav' )[0].innerHTML;

因为getElementsByClassName()返回一个数组，而不是一个对象（因为它可以返回多个项目）。在这方面它与getElementById()不同，因为getElementById()只返回一个对象。

insertHTML与隐藏元素

3 个答案: