Question

我正在为所有图片链接添加新的div，如下所示：

var images = document.getElementsByTagName('img');
for (var i = 0; i < images.length; i++) {    
    var divLink = document.createElement("div");
    divLink.style.position = "absolute";
    divLink.style.top = "10px";
    divLink.style.right = "10px";
    divLink.style.zIndex="1";
    divLink.style.fontSize = "20px";
    divLink.style.backgroundColor = "black";
    divLink.style.color = 'white';
    divLink.innerHTML = linkCount;
    images[i].parentNode.insertBefore(divLink, images[i] );
}

上面的代码会将新的divLink属性添加到以下HTML中：

<li>
<div>
<a title="Free Shipping" href="http://www.url.com/cp/School-Uniforms" onclick="s_objectID="http://www.url.com/cp/School-Uniforms/">
<img width="100" height="100" border="0" src="http://i9.url.com/images/Site/Apparel.jpg" alt="Free Shipping">
</a>
</div>
<div class="cat1">Apparel</div>
<div class="cat2">
<a title="Free Shipping" href="http://www.url.com/cp/School-Uniforms" onclick="s_objectID="http://www.url.com/cp/School-Uniforms">Free Shipping</a>
</div>
</li>

我现在需要在不属于图像的所有文本链接上附加一个类似的元素。我知道我可以使用以下方式找到所有链接：

var links = document.querySelectorAll("a");

如何分隔包含图像的链接，并且只选择不属于图像的链接，以便我添加的属性不会被添加到图像链接两次。

Answer 1

将类添加到非“图片链接”，例如.standardLink，然后使用：

var links = document.querySelectorAll(".standardLink");

或者使用jQuery：

var links = $(".standardLink");

然后遍历数组，随意执行任何操作：

for (i in links){
    doSomethingToThisLink(links[i]);
}

过滤不属于图像的链接

1 个答案: