Question

我试图用Id更改class的内容，但我不知道为什么这不起作用......

<h1 id="header">header</h1>
<h4 id="sub">sub header</h4>

<span class="content">Please work!</span>

这是返回＆＃39; undefined＆＃39;，我的文字编辑器似乎无法识别getElementsByClassName - 它可以正常使用getElementById

 var test = document.getElementsByClassName("content").innerHTML;

 document.getElementById("header").innerHTML = test;

DEMO

Answer 1

问题的关键在于小问题＆＃34;隐藏在表达式中：＆＃34; getElement s ByClassName＆＃34;。 document.getElementsByClassName将返回一个数组，以便使第一个元素使用document.getElementsByClassName("content")[0]或使用for循环遍历所有元素

＆＃13;

var test = document.getElementsByClassName("content")[0].innerHTML;

document.getElementById("header").innerHTML = test;

var elements = document.getElementsByClassName("content")
for (var i = 0; i < elements.length; ++i) {
  // elements[i]
}

＆＃13;

<h1 id="header">header</h1>
<h4 id="sub">sub header</h4>

<span class="content">Please work!</span>

＆＃13;

Answer 2

像这样访问它： -

document.getElementsByClassName("content")[0];

getElementsByClassName()方法获取的许多DOM元素与getElementById()不同，后者只有一个。

Answer 3

＆＃13;

var test = document.getElementsByClassName("content")[0].innerHTML;
document.getElementById("header").innerHTML = test;

＆＃13;

<h1 id="header">header</h1>
<h4 id="sub">sub header</h4>


<span class="content">It's working!</span>

＆＃13;

Answer 4

这应该可以解决您的问题。如果我能做任何事情，请告诉我。）

document.getElementById只返回一个元素。 document.getElementsByClassName和document.getElementsByTagName可以返回多个元素，因为页面上可以有多个a元素，页面上使用多个类名，但每页只能有一个ID。话虽这么说，你必须告诉JavaScript你想要哪个元素，因为可以有多个类名为content的元素。为此，请使用document.getElementsByClassName('content')[index]。许多人喜欢在这里使用循环来快速遍历具有特定类或标记名称的所有元素。

希望你学到了一些东西，我每天都在这里学到一些东西：）

＆＃13;

window.addEventListener('load', function() {
  var test = document.getElementsByClassName("content")[0].innerHTML;
  document.getElementById("header").innerHTML = test;
});

＆＃13;

<h1 id="header">Default header HTML</h1>
<h4 id="sub">sub header</h4>

<span class="content">Content HTML</span>

＆＃13;

Answer 5

getElementsByClassName返回一个元素数组（而getElementById返回一个元素 - 注意复数与单数）。由于javascript数组没有innerHTML属性，因此您将获得未定义的属性。您必须首先从数组中检索元素。 e.g。

var elements = document.getElementsByClassName("content");
var firstElement = elements[0];
var x = firstElement.innerHTML // and so on...

getElementByClassName返回＆＃39; undefined＆＃39;，但它适用于Id？

5 个答案: