jQuery中的并集、交集、全局、后代、子、同辈、属性选择器

最新推荐文章于 2022-08-27 21:33:01 发布
最新推荐文章于 2022-08-27 21:33:01 发布
阅读量318 收藏 1
点赞数 1
文章标签： javascript xhtml ViewUI
原文链接：http://www.cnblogs.com/zhouguoshuai/p/8192167.html
版权

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>jQuery中的并集、交集、全局、后代、子、同辈、属性选择器</title>
        <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
        <script type="text/javascript">
            $(function() {
                //并集选择器。使用“,”区分开
                $("th,td").css("border", "blue double 3px");
                //交集选择器。直接把多个选择器连接在一起
                //$("input.txtBox#userName").css("border", "black none 0px").css("background-color", "lightgreen");
                $("input.txtBox").css("border", "black none 0px").css("background-color", "lightgreen");
                //全局选择器。使用"*"表示选择页面上所有的元素
                $("*").css("font", "微软雅黑").css("font-size", "11pt");
                //网站上常用的字体：
                //正文：宋体9pt,宋体10pt
                //标题：微软雅黑10pt,微软雅黑11pt
                //后代选择器。选择的是子元素，使用“ ”(空格)隔开
                $("tr th").css("background-color", "lightcyan");
                //子选择器。选择的是子元素，使用“>”隔开
                $("tr>th").css("background-color", "lightcyan");
                //相邻选择器。选择的是相邻的一个元素，使用“+”隔开
                $("#item1+li").css("color", "green");
                //同辈选择器。选择的是同一级别的元素，使用“~”隔开
                $("#item1+li~li").css("font-weight", "bold");
                //属性选择器。
                $("input[type='submit']").css("background-color", "red").css("color", "white");
                $("[id^='user']").css("font-size","20pt");
            });
        </script>
    </head>

    <body>
        <table border="0" cellspacing="2" cellpadding="0">
            <tr>
                <th>Header</th>
                <th>Header</th>
                <th>Header</th>
                <th>Header</th>
                <th>Header</th>
            </tr>
            <tr>
                <td>Data</td>
                <td>Data</td>
                <td>Data</td>
                <td>Data</td>
                <td>Data</td>
            </tr>
        </table>
        <table>
            <tr>
                <td>
                    帐号：
                </td>
                <td>
                    <input type="text" class="txtBox" id="userName" />
                </td>
            </tr>
            <tr>
                <td>
                    密码：
                </td>
                <td>
                    <input type="password" class="txtBox" id="userPass" />
                </td>
            </tr>
            <tr>
                <td colspan="2" align="center">
                    <input type="submit" value="登录" />
                </td>
            </tr>
        </table>

        <ul type="none">
            <li id="item1">项目一</li>
            <li>项目二</li>
            <li>项目三</li>
            <li>项目四</li>
            <li>项目五</li>
        </ul>
    </body>

</html>

转载于:https://www.cnblogs.com/zhouguoshuai/p/8192167.html

weixin_30411239
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
jquery4种选择器
07-26
jquery的id选择器，标签选择器，类选择器，属性选择器，里面都有，包括jquery文件
并集选择器
weixin_42900834的博客
02-03 361
代码1： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <...
【web前端(三十七)】javascript_jquery核心对象的三种用法、并集选择器
LED_of_Java的博客
08-14 352
首先，我们要取www.jquery.com上下载一个jquery脚本文件： 然后，我们再另存为我们项目文件下的一个脚本文件就行了。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>jquery核心对象的三种用法</ti...
css案例学习之并集选择器
weixin_34064653的博客
12-31 171
代码 <html> <head> <title>并集选择器</title> <style type="text/css"> h1, h2, h3, h4, h5, p{ /*并集选择器*/ color:purple; /* 文字颜...
分类解析jQuery选择器
11-26
　selecttor1,selector2　并集，返回两个选择器匹配到的元素 层次选择器： 　ancestor descendant　根据祖先匹配所有的后代元素 　parent>child　根据父元素匹配所有的子元素，直接后代 　prev+next　匹配下一个兄弟...
java8 集合求差集、并集、交集的实例
08-28
下面小编就为大家分享一篇java8 集合求差集、并集、交集的实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
中科星图GVE-矢量之间的交集，并集和差集等关系.pdf
最新发布
02-19
在数学中，我们经常需要对矢量之间的关系进行分析，包括求交集、并集和差集等运算。下面将对这些概念进行具体解释。 1. 交集： 矢量的交集是指两个矢量中共同存在的元素所构成的集合。假设有两个矢量A和B，它们分别...
了解JavaScript中的选择器
12-02
.getElementById(“id”)id选择器; .getElementsByName(“name”)name选择器; .getElementsByTagName(“tagname”)tag标签名选择器； .getElementsByClassName(“.classname”).class名选择器 示例代码： <!...
jQuery基础
sl105105的博客
07-11 261
jQuery的优势 体积小，压缩后只有100KB左右 强大的选择器 出色的DOM封装 可靠的事件处理机制 出色的浏览器兼容性 使用隐式迭代简化编程 丰富的插件支持
jQuery 兄弟元素选择器
热门推荐
黄河爱浪的博客-专注CSS,jQuery,uni-app领域
09-17 4万+
本篇文章介绍jQuery的兄弟元素选择器。兄弟节点的查找方式有很多，本文章只列举出实用性较高的方式。
jQuery选择器
疯狂的卡夫卡的博客
09-12 233
jquery选择器： 1.基本选择器标签选择器 类选择器 ID选择器 并集选择器 交集选择器 全局选择器 2.层次选择器后代选择器 子选择器 相邻选择器 同辈选择器 3.属性选择器[attribute] [attribute=value] [attribute!=value] [attribute^=value] [attribute$=value] [attribute*=value] [sele
jQuery的7个同级选择器
front_end_fan
08-29 1万+
jQuery的同级选择器有七个，其中最常用的是next()和prev()，使用时要避免跟after()和before()混淆。前者是获取元素，后者是往指定位置插入值。通过下面的demo可以清楚的了解这7个同级选择器：<!doctype html> <html> <head> <meta charset="utf-8"> <title>jQuery遍历之同级遍历</title> <script src
jquery 联合选择器，相对选择和层级选择器__多类交集选择器,多属性选择器
houzhyan-博客
10-26 8808
1、多条件选择器 用途：使用多个条件同时选择多个标签 用法：$(“条件1，条件2，条件3，……，条件n “); 特征：多个条件在“”内用逗号隔开； 用例：$(“div#id,span.tip,p”); //同时选择id为“id”的div标签,class为“tip”的span标签和p标签； 2、相对选择器 用途：使用第二个参数选出相对元素，从而不影响其他具有相同条
JQuery【选择器】
m0_64522859的博客
03-10 879
一、jQuery简介 1.什么是jQuery？ jQuery是一个优秀的JavaScript库，是一个凭借简洁的语法和跨平台的兼容性，极大地简化了JavaScript开发人员遍历HTML文档，操作DOM，执行动画和开发Ajax的操作。jQuery封装了很多预定义的对象和函数。其理念：write less,do more. 2.jQuery的使用方式 下载网站：http://jquery.com/download/ 下载后引入H-BuildX <script src="jqu.
jQuery系列之选择器
老__L的博客
08-27 2653
原生 JS 获取元素方式很多，很杂，而且兼容性情况不一致，因此 jQuery 给我们做了封装，使获取元素统一标准。根据给定的ID匹配一个元素。使用任何的元字符作为名称的文本部分， 它必须被两个反斜杠转义：。 1.1.2.1、参数 id：String 用于搜索的，通过元素的 id 属性中给定的值 1.1.3、示例 查找含有特殊字符的元素 1.2、全选选择器 1.2.1、概述 匹配所有元素多用于结合上下文来搜索。 1.2.3、示例 找到每一个元素 1.3、类选择器 1.3.1、概述 根据给定的 css
jQuery 入门&选择器
weixin_66116818的博客
03-10 998
什么是jQuery？ j:javascript Query:查询 jQuery的概念 jquery是一个js库。意思就是jquery是js封装的一个库，将原来一些js的写法变得更加简洁，并且提供了更加方便的选择器。所有jquery都能用js来完成 也可以通过CDN（Content Distrubute Net）来引用jquery jQuery文件的导入 通过script标签导入 注意事项：如果一个script标签中有src属性并且有值，那么该标签中间不能再次编写代码 <script
jQuery学习心得----第一集：选择器（#）
ClareQi的博客
08-30 941
今年刚大学毕业，就在公司开始弄前端，说实话，刚开始也确实有很多不会的地方，慢慢边学边总结吧，也希望把自己的学习心得分享给大家。言归正传，jQuery是什么？我听这个名字也才近两个月，按照我的理解，就是一些封装好的JavaScript库，我们拿来使用而已。 在写HTML页面的时候，我们要对某一样元素（就是css中的p、div等标签）添加效果的时候，第一步是干什么呢？毋庸置疑，是要选择到这个元素，所
css选择器并集交集
09-22
并集选择器是通过逗号将多个选择器连接在一起的，可以同时选择多个元素，并为它们定义相同的CSS样式。例如，使用并集选择器可以选择多个标签，并将它们的背景颜色设置为相同的值。 交集选择器由两个选择器构成，...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值