在没有类和id的div中获取元素

Question

我有一个分页div,其中我有一个html,我不能配置为添加类或ID。我得用我现有的工作。

我有一个问题，当页面被选中时，它会丢失。自动的页面编号是文本：“1”或它也可以是“2”，我想知道一种方法，通过css或javascript我可以得到这个元素“1”或“2”或“3”...并自定义它。

代码如下：

null

<nav class="bs__pagination" aria-label="Paginação">
<i class="icon-seta-esquerda-b icon" aria-hidden="true"></i>
  "1"
<a href="p0/IZ7_819E19820H3TB0Q3I25JK808F2=CZ6_819E19820H3TB0Q3I25JK800I3=MKJTMIKw=GNJ=/#Z7_819E19820H3TB0Q3I25JK808F2" title="Link para a página 2" id="pc1617030662888_linkToPage_2">2</a>
<a href="p0/IZ7_819E19820H3TB0Q3I25JK808F2=CZ6_819E19820H3TB0Q3I25JK800I3=MKJTMIKw=GOJ=/#Z7_819E19820H3TB0Q3I25JK808F2" title="Link para a página 3" id="pc1617030662888_linkToPage_3">3</a>
<a href="p0/IZ7_819E19820H3TB0Q3I25JK808F2=CZ6_819E19820H3TB0Q3I25JK800I3=MKJTMIKw=GPJ=/#Z7_819E19820H3TB0Q3I25JK808F2" title="Link para a próxima página" id="pc1617030662888_nextPage"><i class="icon-seta-direita-b icon" aria-hidden="true"></i></a>
</nav>

null

有人能帮帮我吗？

Answer 1

如果它是页面上唯一的一个，您可以使用CSS选择器.bs__paginationi和queryselector选择它前面的i元素，并使用它的nextsibling属性获取它后面的文本节点，使用它的nodevalue获取字符串（可能使用trim()删除空格）：

null

console.log(
    document.querySelector(".bs__pagination i")
        .nextSibling
            .nodeValue.trim()
);

html lang-html prettyprint-override"><nav class="bs__pagination" aria-label="Paginação">
<i class="icon-seta-esquerda-b icon" aria-hidden="true"></i>
  "1"
<a href="p0/IZ7_819E19820H3TB0Q3I25JK808F2=CZ6_819E19820H3TB0Q3I25JK800I3=MKJTMIKw=GNJ=/#Z7_819E19820H3TB0Q3I25JK808F2" title="Link para a página 2" id="pc1617030662888_linkToPage_2">2</a>
<a href="p0/IZ7_819E19820H3TB0Q3I25JK808F2=CZ6_819E19820H3TB0Q3I25JK800I3=MKJTMIKw=GOJ=/#Z7_819E19820H3TB0Q3I25JK808F2" title="Link para a página 3" id="pc1617030662888_linkToPage_3">3</a>
<a href="p0/IZ7_819E19820H3TB0Q3I25JK808F2=CZ6_819E19820H3TB0Q3I25JK800I3=MKJTMIKw=GPJ=/#Z7_819E19820H3TB0Q3I25JK808F2" title="Link para a próxima página" id="pc1617030662888_nextPage"><i class="icon-seta-direita-b icon" aria-hidden="true"></i></a>
</nav>

Answer 2

假设活动页总是存储在父页中唯一包含内容的节点中，那么您可以使用filter()检索它，并使用textcontent获取其中的文本。试试看：

null

let nodes = [...document.querySelector('nav.bs__pagination').childNodes];
let textNodes = nodes.filter(node => node.nodeType === 3 && node.textContent.trim().length > 0);
let pageNumber = textNodes[0].textContent.trim();
console.log(pageNumber);

html prettyprint-override"><nav class="bs__pagination" aria-label="Paginação">
  <i class="icon-seta-esquerda-b icon" aria-hidden="true"></i> "1"
  <a href="p0/IZ7_819E19820H3TB0Q3I25JK808F2=CZ6_819E19820H3TB0Q3I25JK800I3=MKJTMIKw=GNJ=/#Z7_819E19820H3TB0Q3I25JK808F2" title="Link para a página 2" id="pc1617030662888_linkToPage_2">2</a>
  <a href="p0/IZ7_819E19820H3TB0Q3I25JK808F2=CZ6_819E19820H3TB0Q3I25JK800I3=MKJTMIKw=GOJ=/#Z7_819E19820H3TB0Q3I25JK808F2" title="Link para a página 3" id="pc1617030662888_linkToPage_3">3</a>
  <a href="p0/IZ7_819E19820H3TB0Q3I25JK808F2=CZ6_819E19820H3TB0Q3I25JK800I3=MKJTMIKw=GPJ=/#Z7_819E19820H3TB0Q3I25JK808F2" title="Link para a próxima página" id="pc1617030662888_nextPage"><i class="icon-seta-direita-b icon" aria-hidden="true"></i></a>
</nav>