Question

我试图获取一组名称并使用for循环将它们添加到单个变量中，然后将其显示到控制台。

var list = "";
var names = document.getElementsByTagName('h3');

for(i=0;i<names.length;i++){
    list = list.concat(names[i].firstChild);
}

console.log(list);

但它输出了一长串清单：

[object Text][object Text][object Text][object Text][object Text][object Text][object Text]

注意：控制台中的console.log(names[22].firstChild)输出"Richard"就好了。我在将它们连接到变量list时遇到了问题。

代码如下。

<h3 style="color:white; font-weight:300;" class="staff">
  Richard Smith<br>
  <span style="font-size:14px;">Data Analyst</span>
</h3>

这就是我使用.firstChild的原因。如果我使用.innerText，则会返回名称和其后的<span>。

Answer 1

names[i].firstChild属性引用包含您想要获取的值的文本节点。

使用firstChild或innerHTML来获取字符串而不是文本节点，而不是访问innerText属性。

我在每个名字之间添加了一个空格。

var list = "";
var names = document.getElementsByTagName('h3');

for (i = 0; i < names.length; i++) {
  list = list.concat(names[i].innerHTML.split('<br>')[0] + ' ');
}

console.log(list);

<h3 style="color:white; font-weight:300;" class="staff">
  Richard Smith<br>
  <span style="font-size:14px;">Data Analyst</span>
</h3>

修改

OP发布HTML后更新了答案。

使用您正在使用的HTML结构，innerText属性也将检索作业标题。

如果您的所有<h3>代码的格式都相同，则可以获取innerHTML，然后将字符串拆分为<br>，然后取出包含该名称的前半部分并将其附加到您的列表中。

Answer 2

使用nodeValue

var list = "";
var names = document.getElementsByTagName('h3');

for(i=0;i<names.length;i++){
    list = list.concat(names[i].firstChild.nodeValue + ' ');
}

console.log(list);

JsFiddle

使用for循环连接对象文本值 - Javascript

2 个答案: