CSS选择器最后一个元素

发布于 2025-02-09 15:58:24 字数 1943 浏览 1 评论 0原文

我正在使用看起来像这样的html文档。

它包含几个＆lt; li＆gt;＆lt;/li＆gt;元素。目前，它包含两个。但这本质上是动态的，可以更多。

console.log(document.querySelectorAll('li.lia-paging-page-last>a')[1].getAttribute('href'))

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
  </head>
  <body>
<div class="lia-page">  
    <li class="lia-component-pagesnumbered">
      <ul class="lia-paging-full-pages">
        <li class="lia-paging-page-last lia-js-data-pageNum-39">
          <a class="lia-js-data-pageNum-109 lia-link-navigation lia-custom-event" aria-label="Page 39" id="link_8" href="abc.com">129</a>
        </li>
      </ul>
    </li>
    <li class="lia-component-pagesnumbered">
      <ul class="lia-paging-full-pages">
        <li class="lia-paging-page-last lia-js-data-pageNum-49">
          <a class="lia-js-data-pageNum-109 lia-link-navigation lia-custom-event" aria-label="Page 49" id="link_77" href="xyz.com">229</a>
        </li>
      </ul>
    </li>
</div>    
  </body>
</html>

我需要查询最后一个＆lt; li＆gt;＆lt;/li＆gt;元素的href。我可以使用CSS选择器可以返回最后一个元素吗？

目前，我正在这样做，并将长度1作为[1]选择最后一个元素。我想绕过这一点，如果有一种使用CSS选择器的方法，可以始终返回其中的最后一个元素。

document.queryselectorall（'li.lia-paging-page-last＆gt; a'）[1] .getAttribute（'href'）

i也尝试了以下操作，并且它不起作用。

docuns.queryselectorall（'li.lia-paging-page-last＆gt; a：last-type'）。getAttribute（'href'）

原文

I am working with a HTML document that looks like this.

It contains several <li></li> elements. At the moment it contains two. But it is dynamic in nature and it can be more.

console.log(document.querySelectorAll('li.lia-paging-page-last>a')[1].getAttribute('href'))

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
  </head>
  <body>
<div class="lia-page">  
    <li class="lia-component-pagesnumbered">
      <ul class="lia-paging-full-pages">
        <li class="lia-paging-page-last lia-js-data-pageNum-39">
          <a class="lia-js-data-pageNum-109 lia-link-navigation lia-custom-event" aria-label="Page 39" id="link_8" href="abc.com">129</a>
        </li>
      </ul>
    </li>
    <li class="lia-component-pagesnumbered">
      <ul class="lia-paging-full-pages">
        <li class="lia-paging-page-last lia-js-data-pageNum-49">
          <a class="lia-js-data-pageNum-109 lia-link-navigation lia-custom-event" aria-label="Page 49" id="link_77" href="xyz.com">229</a>
        </li>
      </ul>
    </li>
</div>    
  </body>
</html>

I need to query the href of the last <li></li> element. Is there a CSS selector I can use that can return the last element?

Currently, I am doing this and hardcoding the length-1 as [1] to select the last element. I want to bypass that, if there is a way to use a CSS selector that can always return the last element of this.

document.querySelectorAll('li.lia-paging-page-last>a')[1].getAttribute('href')

I also, tried the following and it did not work.

document.querySelectorAll('li.lia-paging-page-last>a:last-of-type').getAttribute('href')

分享到QQ

分享到微博