Question

我正在尝试制作一个JavaScript网络扩展名，以添加几个数字，例如。指向购物网站http://www.tomleemusic.ca

上每个产品的超链接文本的内部文本末尾的“ 123”

例如，如果我转到此链接，http://tomleemusic.ca/catalogsearch/result/?cat=0&q=piano

我想在每个产品名称的末尾添加一些数字。 name of product and its nested hyperlink

到目前为止，我已经尝试了以下代码，但未产生任何结果。感谢您的帮助:)

var products= document.querySelector(".category-products, .products- 
grid category-products-grid itemgrid itemgrid-adaptive itemgrid-3col 
centered hover-effect equal-height");
var productslist = products.getElementsByClassName("item");
for (var i = 0; i < productslist.length; i++) {
    productslist[i].getElementsByClassName("product-name").innerHTML = 
productslist[i].getElementsByClassName("product-name").innerHTML + 
"1234";
}

Answer 1

您的查询是错误的，您应使用querySelectorAll而不是querySelector来获取所有与查询匹配的元素。

以下是给定站点所需的代码：

var productsListLink = document.querySelectorAll(".products-grid .item .product-name a:not(.product-image)");
for (var i = 0; i < productsListLink.length; i++) {
    var a = productsListLink[i];
    var name = a.innerHTML || "";
    name += "1234";
    a.innerHTML = name;
    a.setAttribute('title', name);
}

Answer 2

我想我找到了您所需要的。

var products = document.querySelector(".category-products .products-grid.category-products-grid.itemgrid.itemgrid-adaptive.itemgrid-3col.centered.hover-effect.equal-height");
var productslist = products.getElementsByClassName("item");

for (var i = 0; i < productslist.length; i++) {
var productName = productslist[i].getElementsByClassName("product-name")[0].firstChild;
productName.innerHTML = productName.innerHTML + "1234";
}

如何使用嵌套类更改网络元素列表中每个项目的innerHTML

2 个答案: