jQuery选择器-内容选择器示例

最新推荐文章于 2021-03-07 19:55:13 发布
最新推荐文章于 2021-03-07 19:55:13 发布
阅读量250 收藏
点赞数
分类专栏： jQuery九类选择器及应用
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_34734520/article/details/51622224
版权 
<span style="font-size:18px;"><html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"></span>
<span style="font-size:18px; white-space: pre;">	</span><span style="font-size:24px;color:#ff0000;">//jQuery版本根据实际导入版本选择</span><span style="font-size:18px;">
    <script type="text/javascript" src="js/jquery-2.2.4.js"></script>
    <style type="text/css">
        .myClass{
            font-size:44px;
            color:blue
        }
    </style>
</head>
<body>

    <div><p>John Resig</p></div>
    <div><p>George Martin</p></div>
    <div>Malcom John Sinclair</div>
    <div>J. Ohn</div>
    <div></div>

    <p>   </p>
    <p></p>

<script type="text/javascript">

    //1)查找所有包含文本"John"的div元素的个数
       // alert($("div:contains('John')").size());

    //2)查找所有p元素为空的元素个数
       //alert($("p:empty").size());

    //3)给所有包含p元素的div元素添加一个myClass样式
        </span><span style="font-size:24px;color:#ff0000;">//$("div:has(p)").css();//临时设置样式
        //alert($("div:has(p)").addClass("myClass"));//已经设置好的样式直接调用</span><span style="font-size:18px;">

    //4)查找所有含有子元素或者文本的p元素个数,即p为父元素
    //空格也代表有元素
        alert($("p:parent").size());

</script>

</body>
</html></span>

qq_34734520
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
根据案例学习CSS选择器之内容选择器: csdn博客改版之后，怎样把博文批量从试读设置为收费
skysys的研究小屋
04-18 445
我们观察后台: 选择器中有根据标签内容进行选择的选择器:contains 据此我们编写代码: $('span:contains("设置为付费")').click() 即可~
jquery选择器-根据多个属性选择示例代码
12-12
根据多个属性选择E[attr=val][attr=val] $(“div[title=’ttt’][class=’aaaa’]”).click()……………. 所有div元素下所有属性title值是等于ttt并且属性class等于aaaa的元素
筛选选择器案例
weixin_43750162的博客
04-05 221
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src="jquery-1.7.1.min.js" ></script> <sc...
jQuery中选择器（包含实例）
冰雪为融的博客
06-20 2267
因为我查了一下，发现网上别人总结的确实也都不错了，所以我下面主要是对选择器的使用（其实主要还是为了督促自己多练习使用啦）推荐两个我觉得不错的关于选择器的总结：jQuery选择器、W3C-jQuery选择器jQuery中的选择器，主要也就分为：基本选择器、属性选择器、内容选择器、过滤选择器、子元素选择器、表单元素选择器等基本选择器，也是我们用的最多的，我就不再举例了属性选择器的使用：[attribu...
jQuery选择器示例
weixin_30737433的博客
12-09 63
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>demo</title> <script src="./scripts/jquery-1.9.1.js"></script&gt...
jQuery选择器-综合案例
任性的wo的博客
08-13 2308
综合案例 这是一个综合的案例，主要就是展示选择器的使用，案例中的选择器是相对比较复杂的，很多时候我们不需要写这么复杂的选择器，但是案例是为了展示整个选择器的知识点的运用 右边是一段文本，我们通过不同的选择器给指定的文字赋予颜色 分析一段复杂的选择器： $("#menu_con div.tag dd > p:first-child") 这段组合的选择器表达式用到了几
jQuery内容过滤选择器用法示例
10-21
主要介绍了jQuery内容过滤选择器用法,结合实例形式分析了jQuery中使用contains、empty、has、parent等进行内容过滤的操作技巧,需要的朋友可以参考下
jQuery属性选择器用法示例
10-21
主要介绍了jQuery属性选择器用法,结合实例形式分析了jQuery中针对属性的判断与匹配相关操作技巧,需要的朋友可以参考下
关于jquery的多个选择器的使用示例
10-26
jquery的多个选择器，就是可以同时选择多个元素进行操作，下面有个不错的示例，感兴趣的朋友可以参考下
jQuery内容选择器
青椒盖饭的博客
01-14 1958
内容选择器 所谓的内容选择器指的是可以根据元素中所包含的内容来实现相关验证,对于元素内容的判断,可以选择如下的选择器判断 1 :contains(内容) 返回包含指定文本内容的所有元素 元素集合 2 :empty() 选择所有空元素 元素集合 3 :parent 选择所有含有内容的非空元素 元素集合 4 :has(选择器) 获取所有包含制定选择器所匹配的元素...
jQuery选择器案例
端木奇影のWEB前端
05-05 456
jQuery运用选择器简单案例（练习来自《锋利的jQuery》一书）：
jQuery获取Radio选择的Value值:
weixin_34124577的博客
04-14 752
jQuery获取Radio选择的Value值:1. $("input[name='radio_name'][checked]").val();//选择被选中Radio的Value值2. $("#text_id").focus(function(){//code...});//事件 当对象text_id获取焦点时触发3. $("#text_id").blur(function(){/...
jquery各种选择器示例
weixin_30302609的博客
08-16 168
$("#itemExpressionHidden>b:last") 选择id为itemExpressionHidden中的最后一个b标签 $("#itemExpressionHidden>b:contains(不成立):last") 选择id为itemExpressionHidden中的最后一个包含"不成立"的b标签 if($("input[name='yes']")...
jQuery四大选择器，以及例子来充分理解
热门推荐
wang__junhappy的博客
05-14 2万+
1. jQuery选择器的优势：(1) 代码更简单(2) 支持CSS1到CSS3选择器(3) 完善的处理机制2. jQuery选择器的分类（1） 基本选择器      基本选择器是jQuery中使用最多的选择器，它又元素Id、class、元素名、多个元素符组成。      （2） 层次选择器       层次选择器通过DOM元素间的层次关系来获取元素，主要的层次关系包括父子、后代、相邻、兄弟关系。...
jquery内容过滤选择器：内容过滤选择器它是根据元素内部文本内容进行选中。
boss_way的博客
11-01 4530
1.1． 内容过滤选择器 内容过滤选择器它是根据元素内部文本内容进行选中。   :Contains（text）：匹配包含给定文本的元素 :Empty：匹配所有不包含子元素或者文本的空元素 :Has(selector):匹配含有选择器所匹配的元素的元素 :addClassL(“类名”)：给所有的标签添加类名 :Parent：匹配含有子元素或者文本的元素 示例： $(fu
jquery选择器使用案例
现役码农的博客
10-09 403
项目中需要获取一个动态拼接的table中的数据，除了可以使用form表单的模式，这里尝试了一种新的方法。使用选择器获取数据。 table样式大概如下： function getfrontTable(data) { PJX++;//序列号累加 var num = data.indicators.length; var table = "&lt;div&gt;" + "&lt...
jQuery选择器经典案例
deserts的博客
08-05 645
jQuery选择器经典案例。
jQuery 内容选择器
Polly
03-07 154
jQuery 内容选择器 :contains(text) :empty :has(selector) :parent
jQuery根据文本内容text进行选择
XerCis的博客
01-16 5906
问题描述 <!DOCTYPE html> <head> <meta charset="utf-8"> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> </head> <body> <ul&g...
jQuery 选择器示例
最新发布
07-12
当您使用jQuery时，选择器是一种强大的工具，用于选择DOM元素并对其进行操作。以下是一些常见的jQuery选择器示例： 1. 通过元素名称选择元素： ``` $("p") // 选择所有 <p> 元素 $("div") // 选择所有 <div> 元素 ``` 2. 通过类名选择元素： ``` $(".my-class") // 选择所有具有 "my-class" 类的元素 ``` 3. 通过ID选择元素： ``` $("#my-id") // 选择 ID 为 "my-id" 的元素 ``` 4. 通过属性选择元素： ``` $("[data-key='value']") // 选择具有 data-key 属性且值为 "value" 的元素 $("[href]") // 选择具有 href 属性的所有元素 ``` 5. 组合选择器： ``` $("p.my-class") // 选择所有具有 "my-class" 类的 <p> 元素 $("div, p") // 选择所有 <div> 和 <p> 元素 ``` 6. 子元素选择器： ``` $("ul > li") // 选择所有直接位于 <ul> 下的 <li> 元素 $(".parent .child") // 选择具有 "child" 类且位于具有 "parent" 类的父元素内的所有元素 ``` 以上只是一些常见的jQuery选择器示例，实际上还有更多选择器和用法可供探索。您可以根据需要使用适当的选择器来选择和操作DOM元素。 如果您有任何其他问题，请随时提问！

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值