Question

我该怎么做？如果可以，请帮忙，

  <div id="user"> one </div>
  <div id="user"> two </div>
    <script>
document.getElementById('user').innerHTML = "three";
  </script>

我在想我们是否可以用“三个”

替换所有具有相同ID的div

Answer 1

多个元素上的相同ID并不是一个好主意，因为在html文档中声明了id的独特性。更好的是使用类。

然后在vanilla JS中你可以做到以下几点：

var users = document.getElementsByClassName('user');
for (var i = 0; i < users.length; ++i) {
    var user = users[i];  
    user.innerHTML = '<p>Hello out there!</p>';
}

或使用jQuery更容易。

Answer 2

虽然在HTML中使用相同的ID非常气馁且无效，但在大多数浏览器中都有这样的方法：

var elements = document.querySelectorAll('[id="user"]');

for(var i = 0; i < elements.length; i++) {
    elements[i].innerHTML = "three";
}

Answer 3

按照w3c标准，您必须使用唯一的ID。

http://www.w3.org/TR/html401/struct/global.html

请参见注释7.5.2元素标识符：id和类属性

您可以使用班级名称。

Answer 4

正如其他人所说，多个ID不适合HTML。相反，您可以使用类：

  <div class="user"> one </div>
  <div class="user"> two </div>

然后您可以使用以下命令选择它们：

document.querySelectorAll('.user').forEach(el => {
 // do things with each element here
});

document.querySelectorAll('.user').forEach(el=>{
    el.style.background = "green";
})

<div class="user"> one </div>
<div class="user"> two </div>

使用Javascript替换所有具有相同ID的innerHTML

4 个答案: