jQuery之基本选择器
1. 是什么?
- 有特定格式的字符串
2. 作用
- 用来查找特定页面元素
3. 基本选择器
- #id : id选择器
- element : 元素选择器
- .class : 属性选择器
- * : 任意标签
- selector1,selector2,selectorN : 取多个选择器的并集(组合选择器)
- selector1selector2selectorN : 取多个选择器的交集(相交选择器)
现有如下需求:
/*
需求:
1. 选择id为div1的元素
2. 选择所有的div元素
3. 选择所有class属性为box的元素
4. 选择所有的div和span元素
5. 选择所有class属性为box的div元素(div.box),如果属性不是id和class,就需要用div【name=“”】来表示
*/
<div id="div1" class="box">div1(class="box")</div>
<div id="div2" class="box">div2(class="box")</div>
<div id="div3">div3</div>
<span class="box">span(class="box")</span> <br>
<ul>
<li>AAAAA</li>
<li title="hello">BBBBB(title="hello")</li>
<li class="box">CCCCC(class="box")</li>
<li title="hello">DDDDDD(title="hello")</li>
</ul>
通过js实现:
console.log($("#div1").get(0).innerHTML);
console.log($("div").length);
console.log($(".box").html());
console.log($("div,span").html());
console.log($("div[class='box']").html());
jQuery之基本选择器的更多相关文章
- jQuery基础之选择器
摘自:http://www.cnblogs.com/webmoon/p/3169360.html jQuery基础之选择器 选择器是jQuery的根基,在jQuery中,对事件处理.遍历DOM和Aja ...
- jQuery 简单过滤选择器
<!DOCTYPE HTML> <html> <head> <title> 使用jQuery基本过滤选择器 </title> <scr ...
- JQuery:JQuery语法、选择器、事件处理
JQuery语法: 通过 jQuery,您可以选取(查询,query) HTML 元素,并对它们执行"操作"(actions). 一.语法:jQuery 语法是通过选取 HTM ...
- 23、jQuery九类选择器/jQuery常用Method-API/jQuery常用Event-API
1)掌握jQuery九类选择器及应用 2)掌握jQuery常用Method-API 3)掌握jQuery常用Event-API 一)jQuery九类选择器[参见jQueryAPI.chm手册] 目 ...
- jQuery基础知识--选择器与效果
$(this).hide()-----隐藏当前元素 $("p").hide()------隐藏所有段落 $(".test").hide()--隐藏所有class ...
- jQuery的筛选选择器
基本筛选选择器 很多时候我们不能直接通过基本选择器与层级选择器找到我们想要的元素,为此jQuery提供了一系列的筛选选择器用来更快捷的找到所需的DOM元素.筛选选择器很多都不是CSS的规范,而是jQu ...
- JQuery总结:选择器归纳、DOM遍历和事件处理、DOM完全操作和动画 (转)
JQuery总结:选择器归纳.DOM遍历和事件处理.DOM完全操作和动画 转至元数据结尾 我们后台可能用到的页面一般都是用jquery取值赋值的,发现一片不错的文章 目录 JQuery总结一:选择器归 ...
- jQuery中的选择器<思维导图>
选择器是jQuery的重要组成部分,在jQuery中,对事件处理.遍历DOM和Ajax操作都依赖于选择器.如果能熟练地使用选择器,不仅能简化代码,而且可以达到事半功倍的效果. 下面是关于jQuery中 ...
- jQuery中的选择器《思维导图》
学习jQuery的课程中,我对jQuery中的选择器有了更深的认识,它的简洁写法,完美的兼容性,可靠的处理机制,都让我们省了很多事, 下面是我在学习过程中对jQuery选择器写的思维导图(全屏查看:& ...
- jQuery简单过滤选择器
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <!--jQuery选择器详解 根据所获 ...
随机推荐
- 项目-高性能TcpServer - 目录
1.项目-高性能TcpServer - 1.网络通信协议 https://blog.csdn.net/arno1988/article/details/82463225 2.项目-高性能TcpServ ...
- linux打patch简单示例
在项目中,有些模块是开源的,没有源码或者不能改动源码,想要修复.优化里面的Bug,这时就需要用到patch了. 1. 生成patch 制作补丁有两种法法,diff和quilt. 1.1 di ...
- T脚本语言学习记录-工具(一)
1.set & unset %set a Hello ;#定义变量 a 并赋值 =>Hello %puts $a ;#输出变量值 =>Hello %set a “Test Tcl” ...
- 开篇~试试word写博客
word发布博客设置,mark一下 原帖地址:http://www.cnblogs.com/liuxianan/archive/2013/04/13/3018732.html word代码高亮插件:h ...
- JVM内存模型(转载)
原文地址:http://blog.csdn.net/u012152619/article/details/46968883 JVM定义了若干个程序执行期间使用的数据区域.这个区域里的一些数据在JVM启 ...
- 【常用】IDEA常用快捷键与操作
以下出场顺序为开始学习IDEA时遇到的顺序,并非实际中的使用频率,最终版待整理 0.“ctrl+space(由于习惯问题我已经更改为alt+/)”——基本提示 “ctrl+shift+space”—— ...
- 20155203 2016-2017-2 《Java程序设计》第2周学习总结
20155203 2016-2017-2 <Java程序设计>第2周学习总结 教材学习内容总结 第三章的主要内容是使用Java语言设计程序的基础语法的学习 java语言中的计算:如果两个数 ...
- L018-课前练习以及知识巩固笔记
L018-课前练习以及知识巩固笔记 OK,今天课前做了几道题,算是对以往知识的巩固. 1.请描述下列路径的内容是做什么的?/etc/sysctl.conf/etc/rc.local/etc/hosts ...
- javaweb(三十四)——使用JDBC处理MySQL大数据
一.基本概念 大数据也称之为LOB(Large Objects),LOB又分为:clob和blob,clob用于存储大文本,blob用于存储二进制数据,例如图像.声音.二进制文等. 在实际开发中,有时 ...
- html查漏补缺之meta标签
什么是meta标签? meta标签是html标记head区的一个关键标签,它位于HTML文档的<head>和<title>之间(有些也不是在<head>和<t ...