jquery 在 <a> 锚标记内的 <i> 斜体标记内选择一个类答案

【问题标题】：jquery select a class within an <i> italics tag that is within an <a> anchor tagjquery 在 <a> 锚标记内的 <i> 斜体标记内选择一个类
【发布时间】：2020-02-26 20:16:31
【问题描述】：

我必须选择页面上所有将其文本包裹在具有类 pdf 的 i 标记中的锚标记。

<a href="somewebsite.com"><i class="pdf"> </i>this is the text</a>

我有这个，它似乎是错误的：

$( "a>i" ).each (function() {
  $(this).find(".pdf");
  alert("This is a PDF icon in an <i> tag");
});

警报似乎命中了两倍之类的次数。

请帮忙。提前致谢！

【问题讨论】：

标签： jquery html dom select

【解决方案1】：

这可以通过jQuery :has selector来完成：

$("a:has(i.pdf)")

根据您的目标，您可能根本不需要使用.each()。例如，如果您想将这些链接变为红色...

$("a:has(i.pdf)").css("color", "red");

a{display:block;}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="somewebsite.com"><i class="pdf"></i>this has &lt;i class="pdf"&gt;</a>
<a href="somewebsite.com"><i class="pdf"></i>this has &lt;i class="pdf"&gt;</a>
<a href="somewebsite.com">this does not have &lt;i class="pdf"&gt;</a>
<a href="somewebsite.com"><i class="pdf"></i>this has &lt;i class="pdf"&gt;</a>

【讨论】：

【解决方案2】：

或者通过对你的脚本做一个小的调整来检查<i>是否有这个类：

$("a>i").each(function() {
    if($(this).hasClass("pdf") {
        alert("This is a PDF icon in an <i> tag");
    }
});

【讨论】：