你如何获得在 jQuery 或 Cheerio js 中包装给定选择器代码的更广泛的上下文 HTML？

如何解决你如何获得在 jQuery 或 Cheerio js 中包装给定选择器代码的更广泛的上下文 HTML？

如果h1+ul>li>details>summary+p的整个HTML有那个结构，你怎么得到它？即，如果没有嵌套的 li、详细信息等，则不会获得 ul 标记元素的 HTML。

h1+ul>li>details>summary+p

<div>
  <h1>T1</h1>
  <ul class="toggle">
    <li>
      <details>
        <summary><strong>Q1</strong></summary>
        <p>Answer1</p>
      </details>
    </li>
  </ul>
  <h1>T2</h1>
  <ul class="toggle">
    <li>
     <details>
       <summary>Q2</summary>
       <strong>Answer2</strong>
     </details>
    </li>
  </ul>
</div>

解决方法

喜欢吗？

const $collection = $("ul.toggle")
  .has("li>details>summary+p")
  .prev()
  .addBack()
  .addClass("red")
  
console.log($collection.text())  

.red { background-color:red }

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
  <h1>T1</h1>
  <ul class="toggle">
    <li>
      <details>
        <summary><strong>Q1</strong></summary>
        <p>Answer1</p>
      </details>
    </li>
  </ul>
  <h1>T2</h1>
  <ul class="toggle">
    <li>
     <details>
       <summary>Q2</summary>
       <strong>Answer2</strong>
     </details>
    </li>
  </ul>
</div>