Question

我需要在框中更改链接的href。我只能使用原生的javaScript。不知何故，我遍历元素以便匹配正确的<a>标记。

由于此容器内的所有标签除了其href值外都相同，因此我需要使用此值来获得匹配。

到目前为止，我已尝试过这个：

var box = document.getElementsByClassName('ic-Login-confirmation__content');
var terms = box.querySelectorAll('a');
if (typeof(box) != 'undefined' && box != null) {
  for (var i = 0; i < terms.length; i++) {
    if (terms[i].href.toLowerCase() == 'http://www.myweb.net/2/') {
      terms[i].setAttribute('href', 'http://newlink.com');
    }
  }
}

然而，我一直得到＆＃34; Uncaught TypeError：box.querySelectorAll不是函数＆＃34;。为了使这项工作，我需要做些什么？

Jsfiddle here

Answer 1

querySelectorAll的美妙之处在于你不需要像那样遍历 - 只需使用

var terms = document.querySelectorAll('.ic-Login-confirmation__content a');

然后迭代那些。更新了小提琴：https://jsfiddle.net/4y6k8g4g/2/

事实上，整件事情可以简单得多

var terms = document.querySelectorAll('.ic-Login-confirmation__content a[href="http://www.myweb.net/2/"]');
if(terms.length){
    terms[0].setAttribute('href', 'http://newlink.com');
}

实例：https://jsfiddle.net/4y6k8g4g/4/

Answer 2

试试这个：

var box = document.getElementsByClassName('ic-Login-confirmation__content')[0];

由于您使用的是getElementsByClassName，它将返回一个元素数组。

Answer 3

您可以使用querySelector通过href attr进行选择，试试这个：

document.querySelector('a[href="http://www.myweb.net/2/"]')

而不是定义确切的href属性，您可以进一步简化它：

document.querySelector('a[href?="myweb.net/2/"]'

仅匹配href属性以"myweb.net/2/"

结尾的元素

Answer 4

getElementsByClassName方法返回带有指定类名的文档中所有元素的集合，作为NodeList对象。

您需要为此实例指定如下：

document.getElementsByClassName('ic-Login-confirmation__content')[0]

这将确保您访问HTML中的正确节点。如果您在示例中console.log box变量，则会看到返回的数组。

遍历javaScript中的元素

4 个答案: