jQuery学习笔记05-内容选择器

喜欢ヅ旅行 2024-04-17 15:33 76阅读 0赞

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>jQuery内容选择器</title>
        <style>
            div{
                width: 50px;
                height: 100px;
                background-color: #FF0000;
                margin-top: 5px;
            }
        </style>
        <script src="jQuery/jquery-1.12.4.js"></script>
        <script>
            $(function () {
                //    编写jQuery代码
                //找到div标签中内容为空的。既没有文本，又没有标签
                var $div1 = $("div:empty");
                console.log($div1)
            //    找到div中内容不为空的
                var $div2 = $("div:parent");
                console.log($div2);
            //    找到div中文本为：我是div
                var $div3 = $("div:contains(我是div)");
                console.log($div3);
            //    找到div中子元素为p标签的
                var $div4 = $("div:has(p)");
                console.log($div4);
            })
        </script>
    </head>
    <body>
    <div></div>
    <div>我是div</div>
    <div>我是</div>
    <div><span></span></div>
    <div><p></p></div>
    </body>
    </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，76人围观）

还没有评论，来说两句吧...

相关阅读

相关 jQuery学习笔记05-内容选择器

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> ...

喜欢ヅ旅行/ 2024年04月17日 15:33/ 0 赞/ 77 阅读

相关 JQuery 内容过滤选择器

HTML页面结构: <body> <a id="a1">contains(text)</a> <a id="a2">empty</a>

一时失言乱红尘/ 2024年02月17日 18:09/ 0 赞/ 67 阅读

相关 JQuery-学习笔记02【基础——JQuery选择器】

> [Java后端学习路线笔记汇总表【黑马程序员】][Java_ _] > > 1. [JQuery-学习笔记01【基础——JQuery基础】][JQuery-_

一时失言乱红尘/ 2022年10月30日 09:28/ 0 赞/ 202 阅读

相关 jQuery学习笔记（一）使用jQuery选择器（荐）

jQuery预先的javascript的编程，提供了计划所有css3下的标准选择器，开发者可以利用这些选择器轻松选择各种元素，供javascript使用。重要的是jQuer

悠悠/ 2022年08月05日 16:18/ 0 赞/ 238 阅读

相关 jQuery学习笔记2之jQuery选择器

一、jQuery的基本选择器下面是利用jQuery的基本选择器进行的演示，跟css的规则一致元素名直接调用元素名 class用.classname id用\idna

喜欢ヅ旅行/ 2022年07月30日 13:13/ 0 赞/ 190 阅读

相关 jQuery内容选择器

jQuery的内容选选择器一共有四个，分别是： :empty :parent :contains(text) :has(selector) 代码如下

灰太狼/ 2022年03月14日 12:06/ 0 赞/ 199 阅读

相关 jQuery的内容选择器

JQuery中的内容选择器 JQuery中的内容选择器有四个： :contains(text) 匹配包含给定文本的元素 :empty 匹配所有不包

我不是女神ヾ/ 2021年12月05日 16:34/ 0 赞/ 364 阅读

相关 jQuery学习——入门jQuery选择器之层次选择器

今天说的是层次选择器，那层次选择器有哪几个？ $("ancestor descendant")：选取parent元素后所有的child元素 $("parent

古城微笑少年丶/ 2021年09月25日 16:22/ 0 赞/ 485 阅读

相关 jquery选择器--学习笔记

一、jquery选择器风格: jquery中的选择器完成继承了CSS的风格。利用JQ选择器，可以非常便捷和快速找出特定的DOM元素，然后为它们添加相应的行为。使用CSS选择

怼烎@/ 2021年09月16日 13:58/ 0 赞/ 357 阅读

相关 jQuery--过滤选择器（简单过滤选择器、内容过滤选择器）详解

过滤选择器基本选择器和层次选择器可以满足大部分页面元素的选取需求。在jQuery中还提供了功能更加强大的过滤选择器，根据特定的过滤规则来筛选出所有需要的页面元素。过滤选

绝地灬酷狼/ 2021年08月13日 23:46/ 0 赞/ 551 阅读