针对网站中的所有链接-JavaScript

我正在尝试以文档中的所有链接为目标。当点击任何链接时，我希望显示模式。模式当前设置为显示：无。我在控制台中没有收到任何错误消息，但它仍然不工作。脚本链接也位于html文档的底部。我错过了什么

var a = document.getElementsByTagName('a');
    for (i = 0; i < a.length; i++) {   
        var links = a[i];
    } 

下面的代码确实有效，但仅适用于第一个链接

var links = document.getElementsByTagName('a')[0];

---

您需要在循环中添加事件侦听器

function openmodal(){
    modal.style.display = "block";
}
var links = document.getElementsByTagName('a');
for (i = 0; i < links.length; i++) {   
   links[i].addEventListener('click', openmodal);
} 

函数openmodal（）{
modal.style.display=“块”；
}
var links=document.getElementsByTagName（'a'）；
对于（i=0；i

您必须将事件侦听器分别添加到每个链接：

var a = document.getElementsByTagName('a');
for (i = 0; i < a.length; i++) {   
    var links = a[i].addEventListener('click', openmodal);
} 

---

您需要将事件侦听器分别添加到循环中的每个锚元素中，或者可以使用Array.prototype.forEach

//normal for loop
var a = document.getElementsByTagName('a');
for (i = 0; i < a.length; i++) {   
        var link = a[i];
        link.addEventListener("click", openmodal);
}

//forEach
[].forEach.call(document.querySelectorAll('a'), function(anchor, index){
    anchor.addEventListener("click", openmodal);
});

//循环正常
var a=document.getElementsByTagName（'a'）；
对于（i=0；i

您有几件事需要纠正。第一:

var a = document.getElementsByTagName('a');
for (i = 0; i < a.length; i++) {   
   var links = a[i];
} 

但是，即使如此，由于您正在使用

=

为其赋值，因此在每次循环迭代时，您仍然会使用新值覆盖存储在变量中的最后一个值。现在，对于上面的代码片段，还不完全清楚您打算做什么

因此，为了实现设置每个链接以激活模式的目标，我们只需收集所有链接，对其进行迭代，并在执行此操作时设置事件处理程序：

var links = document.getElementsByTagName('a');   // Get all the links
for (i = 0; i < a.length; i++) {                  // Loop over them
   links[i].addEventListener('click', openmodal); // Assign handler to each
} 

---

因为您指定了[0]，所以只能获得第一个链接。我只是把它贴出来，显示它的效果，但不是我想要的那样。最后一位代码不再在图片中。在这一点上，变量链接应该等于所有链接，对吗？否，因为您正在覆盖循环中的

链接，而不是添加到其中。@ScottMarcus-第二个示例不是多余的。getElementsByTagName返回活动节点列表，但addEventListener仅在该时间点对列表中的链接进行调用。如果向dom中添加了另一个链接，则列表现在将包含该链接，但它不会自动获得应用于列表中以前内容的相同单击处理程序。（编辑：复制）虽然getElementsByTagName确实返回一个实时列表，但
for
循环将只迭代一次，因此，在第一个示例中，随后出现的锚定标记将不会接收事件侦听器这肯定是选择的答案。获取getElementsByTagName（）的另一个替代方法是为每个链接添加一个类。您可以调用getElementsByCassName（）。@JaeYang True，但您仍然需要设置一个循环并将事件处理程序附加到每个匹配的元素，这比只设置一个事件侦听器而不设置循环更浪费。
var a = document.getElementsByTagName('a');
for (i = 0; i < a.length; i++) {   
   var links = a[i];
} 

var a = document.getElementsByTagName('a');
var links; 
for (i = 0; i < a.length; i++) {   
   links = a[i];
} 

var links = document.getElementsByTagName('a');   // Get all the links
for (i = 0; i < a.length; i++) {                  // Loop over them
   links[i].addEventListener('click', openmodal); // Assign handler to each
} 

// Set up one event listener at a high level that click events will bubble up to
document.addEventListener("click", testTarget);

function testTarget(event){

   // Test to see if the event was triggered by a click to an <a> element
   if(event.target.nodeName === "A"){
      // It was an <a> element that was clicked, show the modal
      showModal();
   }

}