jQuery选择器--selector1,selector2,selectorN和ancestor descendant
selector1,selector2,selectorN
概述
将每一个选择器匹配到的元素合并后一起返回。你可以指定任意多个选择器,并将匹配到的元素合并到一个结果内
参数
selector1 一个有效的选择器;selector2 另一个有效的选择器;selectorN 任意多个有效选择器
<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>
<title></title>
<script>
$(document).ready(function() {
$("button").click(function() {
//selector1,selector2,selectorN选择器
$("#li,p,.main").css("color", "#0000FF");
});
});
</script>
<style>
.main {
color: #FF0000;
}
</style>
</head> <body>
<p>第一个段落。</p>
<p>第二个段落。</p>
<ol>
<li id="li">Java</li>
<li class="main">C#</li>
</ol>
<button>点击按钮</button>
</body> </html>
ancestor descendant
概述
在给定的祖先元素下匹配所有的后代元素
参数
ancestor 任何有效选择器;descendant 用以匹配元素的选择器,并且它是第一个选择器的后代元素
<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>
<title></title>
<script>
$(document).ready(function() {
$("button").click(function() {
//ancestor descendant选择器
$("div p").css("color", "#0000FF");
$("div ol li[name='java']").css("color","#FF0000");
});
});
</script>
</head> <body>
<div>
<p>第一个段落。</p>
<p>第二个段落。</p>
<ol>
<li name="java">Java</li>
<li>C#</li>
</ol>
</div>
<button>点击按钮</button>
</body> </html>
jQuery选择器--selector1,selector2,selectorN和ancestor descendant的更多相关文章
- [selector1][selector2][selectorN]
复合属性选择器,需要同时满足多个条件时使用. 描述: 找到所有含有 id 属性,并且它的 name 属性是以 man 结尾的 HTML 代码: <input id="man-news& ...
- JQuery制作网页—— 第六章 jQuery选择器
1.jQuery选择器:jQuery选择器类似于CSS选择器,用来选取网页中的元素. Eg:$("h3").css("background",&qu ...
- Jquery学习总结(5)——jQuery选择器
1. #id : 根据给定的ID匹配一个元素 <p id="myId">这是第一个p标签</p> <p id="not">这 ...
- jquery 选择器(name,属性,元素)大全
jQuery 选择器大体上可分为:基本选择器.层次选择器.过滤选择器.表单选择器. 其中过滤选择器可以分为:简单过滤选择器.内容过滤选择器.可见性过滤选择器.属性过滤选择器.子元素过滤选择器.表单对象 ...
- jQuery学习笔记(一)jQuery选择器
目录 jQuery选择器的优点 基本选择器 层次选择器 过滤选择器 表单选择器 第一次写博客,希望自己能够长期坚持,以写博客的方式作为总结与复习. 最近一段时间开始学习jQuery,通过写一个jQue ...
- jQuery-强大的jQuery选择器 (详解)[转]
1. 基础选择器 Basics 名称 说明 举例 #id 根据元素Id选择 $("divId") 选择ID为divId的元素 element 根据元素的名称选择, $(&quo ...
- 精通jQuery选择器
虽然jQuery上手简单,相比于其他库学习起来较为简单,但是要全面掌握,却不轻松.因为它涉及到网页开发的方方面面,提供的方法和内部变化有上千种之多.初学者常常感到,入门很方便,提高很困难.本文的目标是 ...
- jQuery选择器和DOM操作——《锋利的jQuery》(第2版)读书笔记1
第1章 认识jQuery jQuery有以下优势: 轻量级: 强大的选择器: 出色的DOM操作的封装: 可靠的事件处理机制: 完善的Ajax: 不污染顶级变量: 出色的浏览器兼容性: 链式操作方式: ...
- jQuery 选择器语法
jQuery选择器分为如下几类(点击“名称”会跳转到此方法的jQuery官方说明文档): 1. 基础选择器 Basics 名称 说明 举例 #id 根据元素Id选择 $("divId&quo ...
随机推荐
- Appium环境配置(二)
一.使用Eclipse直接创建案例工程 1.打开Eclipse,[File]-->[New]-->[Project] 2.选择[Java Project]-->[Next] 3.输入 ...
- HashMap如何做循环遍历
1.TestCase:
- php魔术变量和13个PHP魔术函数
PHP魔术变量确切地说是PHP魔术常量,不过很多常量都是由不同的扩展库定义的,只有在加载了这些扩展库时才会出现,或者动态加载后,或者在编译时已经包括进去了.比如说__LINE__放在不同的地方是显示不 ...
- VS2017使用Git进行源代码管理
步骤一:将解决方案添加到源代码管理 步骤二:进入团队资源管理器 双击存储库项目进入Git操作页面. 步骤三:同步本地代码到远程仓库 选择同步功能 步骤四:发布代码到Git 点击之后输入你要发布的git ...
- webuploader.min.js 简单例子
一个百度开发的开源框架 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html& ...
- 【1】vue/cli 3.0 脚手架 及cube-ui 安装
安装 Vue CLI 需要 Node.js 8.9 或更高版本 (推荐 8.11.0+).你可以使用 nvm 或 nvm-windows在同一台电脑中管理多个 Node 版本. 检查node版本: $ ...
- Spring Hibernate Transaction示例
JDBCDAO.java package com.bf; import java.sql.ResultSet; import java.sql.SQLException; import java.ut ...
- synchronized的简单用法
synchronized 锁定要操作的对象: emp: synchronized(要锁定的对象){ //要做的动作 }
- Python3.6下使用会话session保持登陆状态
本次工具主要利用python easygui模块的inputbox让用户首次输入登陆信息,作为网站requests-post请求的data字段,观察XHR(异步加载)的数据包,构造post请求,利用r ...
- Vim的6种基本模式及基本操作
说明:文章所有内容截选自实验楼教程[Vim编辑器]~ Vim 快速入门 一.实验介绍 1.1 实验内容 本次实验将学习vim中的不同模式和一些基本操作. 1.2 实验知识点 Vim中的六种基本模式 V ...