时间戳

首页 > 解决方案 > 将类添加到“li”，其中包含“a”的href

jquery - 将类添加到“li”，其中包含“a”的href

问题描述

我有一个自动生成的表格，所以我不能把手放在里面。我想知道的是，以一种或另一种方式，我可以将元素的“href”带到并渲染它，就好像它是“li”的类或id，以便能够用css处理它？

<ul>
    <li><a href="#section3"><span class="fp-sr-only">due</span><span></span></a><div class="fp-tooltip fp-right">due</div></li>
    <li><a href="#section4"><span class="fp-sr-only">due</span><span></span></a><div class="fp-tooltip fp-right">tre</div></li>
    <li><a href="#section5"><span class="fp-sr-only">quattro</span><span></span></a><div class="fp-tooltip fp-right">noBar</div></li>
</ul>

简而言之，结果应该是

<ul>
    <li class="section3"><a href="#section3"><span class="fp-sr-only">due</span><span></span></a><div class="fp-tooltip fp-right">due</div></li>
    <li class="section4"><a href="#section4"><span class="fp-sr-only">due</span><span></span></a><div class="fp-tooltip fp-right">tre</div></li>
    <li class="section5"><a href="#section5"><span class="fp-sr-only">quattro</span><span></span></a><div class="fp-tooltip fp-right">noBar</div></li>
</ul>

我在网上没有找到太多。你知道一种方法吗？在此先感谢大家。

标签： jqueryhtmlcss

解决方案

我可以将元素的“href”带到并渲染它，就好像它是“li”的类或id，以便能够用css处理它？

是的，您可以使用属性选择器和 jQueryclosest()方法来做到这一点，例如： 

$('a[href="#section4"]').closest('li').css('background-color', 'green');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul>
  <li>
    <a href="#section3">
      <span class="fp-sr-only">due</span>
      <span></span>
    </a>
    <div class="fp-tooltip fp-right">due</div>
  </li>
  <li>
    <a href="#section4">
      <span class="fp-sr-only">due</span>
      <span></span>
    </a>
    <div class="fp-tooltip fp-right">tre</div>
  </li>
  <li>
    <a href="#section5">
      <span class="fp-sr-only">quattro</span>
      <span></span>
    </a>
    <div class="fp-tooltip fp-right">noBar</div>
  </li>
</ul>

推荐阅读