javascript - 使用Javascript替换getElementsByClassName不起作用

几天前，我posted a question运作良好，我感谢那些提供帮助的人，但由于超出我控制范围的原因，我不得不按照原始帖子的要求而不是id进行分类。

基本上，我想做的是从字符串中删除单词“ Other”（通过表格动态添加内容）。

这是我尝试使用的代码：

var str = document.getElementsByClassName('gv-field-4-custom').innerHTML;
var text = str.replace("Other", " ");
document.getElementsByClassName('gv-field-4-custom').innerHTML = text;

.gv-field-4-custom {
  color: #ff0000;
}

<table>
  <tr>
    <td class="gv-field-4-custom">Complex interventions, Evidence Synthesis (randomised trials), Studies within a Trial (SWAT), Trial Conduct, Trial Design, Other Core Outcome Sets (COS)</td>
  </tr>
</table>

关于我在做什么错有什么建议吗？

最佳答案

您的问题是，getElementsByClassName返回一组元素，在这种情况下，它仅包含一个元素。如果只有一个带有此className的元素，或者只想更改一个元素，则可以这样：

var element = document.getElementsByClassName('gv-field-4-custom')[0];
var str = element.innerHTML;
var text = str.replace("Other", " ");
element.innerHTML = text;

.gv-field-4-custom {
  color: #ff0000;
}

<table>
  <tr>
    <td class="gv-field-4-custom">Complex interventions, Evidence Synthesis (randomised trials), Studies within a Trial (SWAT), Trial Conduct, Trial Design, Other Core Outcome Sets (COS)</td>
  </tr>
</table>

如果您还有更多需要治疗的元素，请按照以下步骤操作：

var elements = document.getElementsByClassName('gv-field-4-custom');

for (var i = 0; i < elements.length; i++) {
  var str = elements[i].innerHTML;
  var text = str.replace("Other", " ");
  elements[i].innerHTML = text;
}

.gv-field-4-custom {
  color: #ff0000;
}

<table>
  <tr>
    <td class="gv-field-4-custom">Complex interventions, Evidence Synthesis (randomised trials), Studies within a Trial (SWAT), Trial Conduct, Trial Design, Other Core Outcome Sets (COS)</td>
  </tr>
</table>

关于javascript - 使用Javascript替换getElementsByClassName不起作用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/29650907/