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

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> 处拆分字符串，然后将包含名称的前半部分附加到您的列表中。