jQuery 选择器(进阶)

我会带着你远行 2022-09-19 12:10 194阅读 0赞

很多css上可以用的在jQuery上都是可以的

1、群组选择器----将相同的样式进行合并

$('div,p,span').css('color','red'); //这样就可以给很多标签设置相同的属性，当然也可以是id或者class

2、后代选择器

<table style="width: 100%;">
            <tr>
                <td>
                 <a title="a2" href="#">首页</a>
                </td>
                <td>
                 <a href="#">首页</a>
                </td>
                <td>
                <a href="#">首页</a>
                </td>
            </tr>       
        </table>  
        <div id="d1">
        <a title="a1" id="a1" href="#">首页</a>
        <a href="#">首页</a></div>

$(function () {
                $("table tr td a").siblings().css("color", "red");//兄弟节点
                $("#d1").children('a').css("color", "red");//子节点
                $("div #a1").next().css("color", "red"); //同级下一个
                $("div #a1").nextAll().css("color", "red"); //同级下面所有同理prev位上面
                $("a[title]").css("color", "red"); //将有title属性的a标签选中
                $("a[title=a2]").css("color", "yellow"); //将有title属性并值位a2的a标签选中
                $("a[title^=a]").css("color", "green"); //将有title属性并开头a的a标签选中
                $("a[title$=a]").css("color", "white"); //将有title属性并结尾a的a标签选中
                $("a[title!=a1]").css("color", "grey"); //将有title属性并不等于a1的a标签选中
                $("a[title*=a]").css("color", "blue"); //将有title属性并包含a的a标签选中
                $("a[id][title*=a]").css("color", "orange"); //多属性选择
            });

发表评论取消回复

表情：

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

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

相关阅读

相关【Java 进阶篇】CSS 选择器详解

![在这里插入图片描述][ee6246a97e76456ea2a96231b3fde401.png] CSS（层叠样式表）是一种用于描述网页上元素样式的语言。要想有效地使用C

喜欢ヅ旅行/ 2024年03月01日 08:37/ 0 赞/ 55 阅读

相关 jQuery选择器、jQuery关系选择器、jQuery伪选择器

一、jQuery选择器 1、父元素(向上遍历单一层级)：parent() 2、祖先元素：parents(selector) 3、子元素(向下遍历单一层级)：child

本是古典何须时尚/ 2023年10月07日 11:58/ 0 赞/ 33 阅读

相关 jQuery 选择器(进阶)

很多css上可以用的在jQuery上都是可以的 1、群组选择器----将相同的样式进行合并 $('div,p,span').css('color','red'); //这样

我会带着你远行/ 2022年09月19日 12:10/ 0 赞/ 195 阅读

相关 Jquery选择器-基本选择器

jquery作为我们常用前端工具之一，实际项目中常用的的选择器有id选择器(\id)、元素选择器(element)、样式选择器(.class)。 \id 概述:根据给定

秒速五厘米/ 2022年07月10日 05:58/ 0 赞/ 392 阅读

相关 jQuery-jQuery选择器

jQuery 选择器 jQuery 选择器允许您对 HTML 元素组或单个元素进行操作。 jQuery 选择器基于元素的 id、类、类型、属性、属性值等"查找"（或选择

雨点打透心脏的1/2处/ 2022年04月17日 07:05/ 0 赞/ 439 阅读

相关 jQuery选择器

jQuery选择器　　jq 选择器和 css 的选择器语法类似, jq 的选择器是他的灵魂　　就是将 html 中的节点元素选择出来的语法, 　　jq 的选择器

╰半夏微凉°/ 2022年01月11日 06:45/ 0 赞/ 309 阅读

相关 jQuery进阶

一、检查jquery是否选择了元素：用jquery对象的length属性判断是否选择到了元素 jquery有容错机制，即使没有找到元素，也不会出错，可以用lengt

超、凢脫俗/ 2021年12月22日 13:01/ 0 赞/ 248 阅读

相关 Jquery 选择器

使用特殊操作符或“组合符”可以将简单选择器组合起来，表达文档树中元素之间的关系。下表列举了jQuery支持的组合选择器。这些组合选择器与CSS3支持的组合选择器是一样的。下

╰半橙微兮°/ 2021年10月08日 05:58/ 0 赞/ 504 阅读

相关 jQuery-选择器

[http://www.webhek.com/post/jquery-61-selector.html][http_www.webhek.com_post_jquery-61-

小鱼儿/ 2021年09月28日 10:46/ 0 赞/ 462 阅读

相关 jQuery 选择器

jQuery 选择器

╰半橙微兮°/ 2021年07月04日 14:22/ 0 赞/ 584 阅读