jQuery选择器笔记
1.$(this).hide() - 隐藏当前元素
$("p").hide() - 隐藏所有段落
$(".test").hide() - 隐藏所有 class="test" 的所有元素
$("#test").hide() - 隐藏所有 id="test" 的元素
2.把所有 jQuery 函数位于一个 document ready 函数中:
$(document).ready(function(){
--- jQuery functions go here ----
});是为了防止文档在完全加载(就绪)之前运行 jQuery 代码
3.jQuery元素选择器
jQuery 使用 CSS 选择器来选取 HTML 元素。
$("p") 选取 <p> 元素。
$("p.intro") 选取所有 class="intro" 的 <p> 元素。
$("p#demo") 选取所有 id="demo" 的 <p> 元素。
例子:将p元素对应的背景颜色改为红色
$(document).ready(function(){
$("button").click(function(){
$("p").css("background-color","red");
});
});
4.JQuery属性选择器
jQuery 使用 XPath 表达式来选择带有给定属性的元素。
$("[href]") 选取所有带有 href 属性的元素。
$("[href='#']") 选取所有带有 href 值等于 "#" 的元素。
$("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。
$("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。
5.更多的选择器
$("ul li:first") 每个<ul>的第一个<li>元素
$("[href$='.jpg']")所有带有以".jpg"结尾的属性值的href属性
$("div#intro.head") id="intro"的<div>元素中的所有class="head"的元素
$(".ex .hide").click(function(){ class为ex中的class为hide的元素
$(this).parents(".ex").hide("slow");
});
jQuery选择器笔记的更多相关文章
- [javascript]jquery选择器笔记
技术文档 中文:http://jquery.cuishifeng.cn/ 英文:http://api.jquery.com/category/selectors/ 分类 基本选择器 层次选择器 过滤选 ...
- jQuery 选择器笔记
jquery基础选择器 $('选择器') 基本上与css选择器相同 demo $('ul li') $('.nav') $('#box') 隐试迭代 遍历内 ...
- Jquery选择器小结
1.基本选择器 $("#id") //ID选择器 $("div") //元素选择器 $(".classname") //类选择器 $(&qu ...
- jQuery学习笔记(一)jQuery选择器
目录 jQuery选择器的优点 基本选择器 层次选择器 过滤选择器 表单选择器 第一次写博客,希望自己能够长期坚持,以写博客的方式作为总结与复习. 最近一段时间开始学习jQuery,通过写一个jQue ...
- 锋利的jQuery读书笔记---选择器
前段时间入手了锋利的jQuery(第二版),想着加强下自己的js能力,可前段时间一只在熟悉Spring和Hibernate.最近抽时间开始读这本书了,随便也做了些记录. 读书的过程是边看边代码测试,所 ...
- Java程序猿的JavaScript学习笔记(8——jQuery选择器)
计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...
- 《jQuery权威指南》学习笔记之第2章 jQuery选择器
2.1 jQuery选择器概述 2.1.1 什么使选择器 2.1.2 选择器的优势: 代码更简单,完善的检测机制 1.代码更简单 示例2-1 使用javascript实现隔行变色 < ...
- JQuery学习笔记——层级选择器
JQuery学习笔记--层级选择器 上一篇学习了基础的五种选择,分别是id选择器,class选择器,element选择器,*选择器 和 并列选择器.根据手册大纲,这篇学习的是层级选择器. 选择器: 1 ...
- 笔记:FastAdmin 之 jQuery 选择器 $("[name$='[]']", form) 学习
笔记:FastAdmin 之 jQuery 选择器 $("[name$='[]']", form) 学习 $("[name$='[]']", form)这个是什 ...
随机推荐
- 浅谈单片机中C语言与汇编语言的转换
做了一单片机设计,要用C语言与汇编语言同时实现,现将这次设计的感受和收获,还有遇到的问题写下,欢迎感兴趣的朋友交流想法,提出建议. 单片机设计:基于51单片机的99码表设计 软件环境:Proteus8 ...
- JBPM
JBPM简介 什么是jbpm JBPM,全称是Java Business Process Management(业务流程管理),它是覆盖了业务流程管理.工作流.服务协作等领域的一个开源的.灵活的.易扩 ...
- 聊聊从web session的共享到可扩展缓存设计
先从web session的共享说起 许多系统需要提供7*24小时服务,这类系统肯定需要考虑灾备问题,单台服务器如果宕机可能无法立马恢复使用,这必定影响到服务.这个问题对于系统规模来说,从小到大可 ...
- .Net程序在linux mono环境和WindowsServer上执行测试对比
最近研究了一下mono,想把windows上写的.Net程序移植到linux上跑.网上有资料说Linux上mono执行.Net程序效率比Windows高,本着实证的态度,只有实际验证过才有说服力. 写 ...
- [PHP源码阅读]array_pop和array_shift函数
上篇文章介绍了PHP添加元素到数组的函数,那么当然有从数组中删除元素.array_pop和array_shift只从数组的头或尾删除一个元素.经过阅读源码,发现这两个函数的实现都是调用了同一个函数-- ...
- 【腾讯Bugly干货分享】一步一步实现Android的MVP框架
本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址:http://dev.qq.com/topic/5799d7844bef22a823b3ad44 内容大纲: Android 开发 ...
- 高级SQL运用
一:什么是数据库设计? 数据库设计就是将数据库中的数据实体以及这些数据实体之间的关系,进行规范和结构化的过程. 二:为什么要实施数据库设计? 1:良好的数据库设计可以有效的解决数据冗余的问题 2:效率 ...
- HTTP权威指南-基础知识
1.URL,URI 统一资源标识符?统一标识定位符? 2.http,https,ftp http://<host>:<port>/<path>/?<que ...
- jQuery之常用且重要方法梳理(target,arguments,slice,substring,data,trigger,Attr)-(一)
1.jquery data(name) data() 方法向被选元素附加数据,或者从被选元素获取数据. $("#btn1").click(function(){ $(" ...
- ElasticSearch 5学习(1)——安装Elasticsearch、Kibana和X-Pack
安装准备: 安装Elasticsearch唯一的要求是安装官方新版的Java,包括对应的Jdk. 安装Elasticsearch 首先到官网下载最新版本的Elasticsearch压缩包. 可以使用命 ...