Question

好的，我是JavaScript的新手，所以我真的需要帮助。我有一个脚本，看起来像这样：

function Change(){
    var image = document.getElementById('id-img');
    image.src = "somenotimportantlink" + document.getElementById('id-a1').title;

    var link = document.getElementById('id-a2');
    link.href="somenotimportantlink"+(document.getElementById('id-a1').title)+"/index.html";    
}

我的问题是有多个标签想要使用此功能，但我只能在一个标签上使用id="id-a1"，所以我需要一个替代getElementById，一个允许我使用多个标签

Answer 1

js中有多种方法可以获取元素，但是如果你想使用css选择器那么你可以使用document.querySelectorAll(".myclass");

编辑：对不起我搞错了...使用querySelectorAll

Answer 2

如果您确实需要按ID选择元素，则可以使用querySelectorAll。

document.querySelectorAll("[id*='id-a']")将匹配包含'id-a'
document.querySelectorAll("[id^='id-a']")会匹配ID为'id-a'的所有元素。

但是，我考虑使用类而不是id：

document.querySelectorAll('.someClass')

请务必使用querySelectorAll代替querySelector来获取所有匹配元素。

有关MDN

的更多信息

Answer 3

大多数人使用jQuery来执行此操作，但您也可以使用JavaScript执行此操作。问题是，它只适用于现代浏览器。

JavaScript方法

您需要使用查询选择器获取所有对象的NodeList，并迭代该NodeList的每个项目。

function myStuff() {
  var nodeList = document.querySelectorAll('.a');
  for (var i = 0, length = nodeList.length; i < length; i++) {
     nodeList[i].href = "somenotimportantlink"+(i.title)+"/index.html";
  }
}

jQuery方法

首先，您希望在HTML中的某个地方安装jQuery，我更喜欢使用CDN，但普通文件没问题。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>

准备好jQuery文件后，您可以通过以下方式选择所有类：

$('.a')

或者如果您想选择所有<a>代码：

$('a')

GetElementById替代更多选项

3 个答案:

JavaScript方法

jQuery方法