Javascript ES6获取最后一个li项中的锚标记。
Javascript ES6获取最后一个li项中的锚标记。
提问于 2018-08-04 02:58:50
我遇到了这样一种情况:我试图获取列表中的最后一个li项，然后获取最后一个li项中的锚标记，这样我就可以使用类名'buyButton‘更改a标记的href值和文本值。
我的列表如下所示：
<li class="item">
<a href="test.html" class="buyButton">Buy</a>
<a href="compare.html" class="compare">Compare</a>
</li>
<li class="item">
<a href="test.html" class="buyButton">Buy</a>
<a href="compare.html" class="compare">Compare</a>
</li>
<li class="item">
<a href="test.html" class="buyButton">Buy</a>
<a href="compare.html" class="compare">Compare</a>
</li>
<li class="item">
<a href="test.html" class="buyButton">Buy</a>
<a href="compare.html" class="compare">Compare</a>
</li>我用来选择最后一个列表的javascript正在运行。代码如下：
var numProducts = document.querySelectorAll('.item').length;
var lastProduct = document.querySelectorAll('.item')[numProducts -1];我正在尝试下面的代码来获取最后一个li项中的锚标记，但它不起作用：
document.querySelectorAll('.item a.buttonBuy')[numProducts -1]
//not working
document.querySelectorAll('.buttonBuy')[numProducts -1]
//also not working我一点也想不出来。在这方面的任何帮助都将不胜感激
回答 2
Stack Overflow用户
发布于 2018-08-04 03:49:45
上一个示例不起作用的原因是因为您使用的是buttonBuy类，而不是buyButton。
执行请求的最简单方法是使用容器选择最后一项，然后您可以选择锚点并根据需要进行修改：
let link = document.querySelector('ul > .item:last-child > .buyButton');
link.textContent = '*Updated*'
link.href = 'javascript:alert("foo")'<ul>
<li class="item">
<a href="test.html" class="buyButton">Buy</a>
<a href="compare.html" class="compare">Compare</a>
</li>
<li class="item">
<a href="test.html" class="buyButton">Buy</a>
<a href="compare.html" class="compare">Compare</a>
</li>
<li class="item">
<a href="test.html" class="buyButton">Buy</a>
<a href="compare.html" class="compare">Compare</a>
</li>
<li class="item">
<a href="test.html" class="buyButton">Buy</a>
<a href="compare.html" class="compare">Compare</a>
</li>
</ul>
Stack Overflow用户
发布于 2018-08-04 03:06:53
一旦我们有了对最后一个LI的引用，我们就可以在LI本身中执行querySelectorAll：
var aWithinLastProduct = lastProduct.querySelectorAll('a')[0];页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51678629
复制相关文章
相似问题