《深入PHP与jQuery开发》读书笔记——Chapter1
由于去实习过后,发现真正的后台也要懂前端啊,感觉javascript不懂,但是之前用过jQuery感觉不错,很方便,省去了一些内部函数的实现。
看了这一本《深入PHP与jQuery开发》,感觉深入浅出,值得推荐。
Chapter1.jQuery简介
1.jQuery工作方式本质
先创建一个jQuery对象实例,然后对传递给该实例的参数表达式求值,最后根据这个值作出相应的响应或者修改自身。
2.利用CSS语法选择dom元素(基本选择器)
我们知道,jQuery说白了就是对网页上的内容进行选择器的新建与操作。
- 通过标签类型选择元素
直接选用标签的元素来作为选择器:
$("p")
- 通过class选择元素
通用格式:.class
$(".foo")
- 通过ID选择元素
通用格式:#id
$("#bar")
- 使用组合选择题
只要元素匹配组合选择器中任意一个选择器,都会被选中并出现在返回结果中:
$("p.foo,#bar")
3.层次选择器
- 选择后代元素
祖先元素 后代元素
例:选择body下的span元素
>>>$("body span")
- 选择子元素
父元素>子元素(只匹配直接子元素)
>>>$("body>span")
>>>[]
- 选择下一个兄弟(next)元素
起始元素标识+下一个兄弟元素标识
注意是在DOM中选择一个元素之后紧跟的下一个兄弟元素!!
>>>$(".foo+p");
- 选择兄弟元素
兄弟元素(sibling elements)是指被同一个元素包裹的同一级的全部元素。选择兄弟元素非常类似于选择下一个元素,只是它返回起始元素之后匹配的全部兄弟元素,而不是只返回下一个。
起始元素标识~匹配兄弟元素
>>>$(".foo~p");
4.基本过滤器
- 选择第一个或最后一个元素
只要在任意选择器之后追加:first或:last即可:
>>>$("p:first");
>>>$("p:last");
- 选择不匹配某个选择器的元素
使用:not()过滤器。
>>>$("p:not(.foo)");
- 选择索引为奇数或偶数的元素
:even 和 :odd
>>>$("p:odd");
>>>$("p:even");
- 选择特定索引的元素
:eq()过滤器。
>>>$("p:eq(3)");
5.内容过滤器
- 匹配包含特定文本的元素
要匹配包含特定文本的元素,使用:contains()过滤器。(仅匹配标签内的文本)
>>>$("p:contains(Another)");
- 匹配包含特定元素的元素
:has()过滤器用来匹配包含特定元素的元素。
>>>$("p:has(span)");
- 选择空元素
:empty()选择出那些不包含任何文本也不包含任何其他元素的空元素。
>>>$(":empty");
- 选择父元素
与:empty相反,:parent只匹配那些拥有子元素的元素,不管它包含的是其他元素,还是文本内容,或者兼而有之。
>>>$("p:parent");
6.可见性过滤器
利用:hidden和:visible,分别用来选择被隐藏的元素和可看到的元素。
>>>$("p:visible"); //可见的
>>>$("p:hidden"); //隐藏的
7.属性过滤器
- 根据属性及属性的值选择元素:
[属性名=属性值]
>>>$("[class=foo]");
- 选择没有某个属性的元素或属性值不匹配的元素
[属性名!=属性值]
$("[class!=foo]");
8.子元素过滤器
- 匹配奇数索引值/偶数索引值/特定索引值的元素
:nth-child()在匹配元素时提供了4个参数:even,odd,index和equation。
>>>$("p:nth-child(odd)");
>>>$("p:nth-child(even)");
- 选择第一个或最后一个子元素
使用:first-child;last-child
>>>$("p span:last-child");
关于选择器:last()和:last-child()的区别:
这两个选择器都是匹配集合中的最后一个元素,差别在于 :last 将匹配所有的集合中的最后一个元素。而 :last-child 将匹配集合中的所有位置为最后一个的子元素。:last 将永远返回一个元素,而 :last-child可能返回一批元素。
9.表单过滤器
目前可用的表单选择器(暗含对input框内type的选择)有:button,:checkbox,:file,:image,:input,:password,:radio,:submit,:text.
如:
>>>$("input:radio");
- 匹配可用或禁用的表单元素
>>>$(":enabled");
>>>$(":disabled");
- 匹配选中或未选中的表单元素
过滤器:checked和:selected分别用于获取checked为真和selected为真的表单元素。
>>>$(":checked");
>>>$(":selected");
就这样吧。
《深入PHP与jQuery开发》读书笔记——Chapter1的更多相关文章
- Flask Web开发读书笔记
开篇:目前想自学Flask Web开发--基于Python,找了几本书准备啃啃,同时也会分享读书笔记.希望和大家一起进步. Flask是小型框架,可以算是微框架,但是他的功能还是比较多 Flask有三 ...
- 锋利的jQuery--编写jQuery插件(读书笔记五)[完结篇]
1.表单验证插件Validation 2.表单插件Form 3.动态事件绑定插件livequery 可以为后来的元素绑定事件 类似于jQuery中的live()方法 4.jQuer ...
- jQuery开发技术笔记
HTML DOM 加载步骤 1. 解析 HTML 结构 2.加载外部脚本和样式表文件 3.解析并执行脚本代码 4.构造 HTML DOM 模型 5.加载图片等外部 ...
- 《锋利的jQuery》读书笔记(DOM+事件)
前阵子买了一批书,就从锋利的jQuery看起吧,书中一些太过常规以及没有强记必要性的操作就不记录了. 1.DOM加载后执行JS $(document).ready(function(){ //.... ...
- 《锋利的jQuery》读书笔记
jQuery理念:write less, do more! 第 一 章一:jQuery简介 a:轻量级 b:强大选择器 c:DOM封装 d:ajax封装 e:不污染顶级变量 只建立一个jQuery对象 ...
- <<敏捷开发>>读书笔记
1.走进敏捷 * 组织成功 增加业务专家,较少bug和测试的交流成本,即使取消不好的技术 首先发布最有价值的特性,时常发布新的版本,即使改进软件 * 技术成功 结对编程,代码审核,确保同一份代码有不同 ...
- 【锋利的Jquery】读书笔记十一
项目进度太赶,天天公司加班12小时,没时间看书充电.2016年再更新一篇吧.现在凌晨2点36分. 2017加油哦 jquery合适的选择器 $("#id") 无疑是最佳提高性能的方 ...
- 【锋利的Jquery】读书笔记七
第七章 jquery插件 管理cookie的插件--cookie jquery插件太多没什么好讲的,百度太多 说以下 cookie插件 <!DOCTYPE html> <html& ...
- 【锋利的Jquery】读书笔记六
ajax优点缺点 json格式的严格 { "people": [ { "firstName": "Brett", "lastNam ...
随机推荐
- RF源码阅读(碎片纪录)-Python积木之contextlib
参考页面: http://docs.python.org/2/library/contextlib.html contextlib是为了配合with语句来使用的.使用起来更加简洁.本来想写一下,这位同 ...
- 20145215实验四 Android开发基础
20145215实验四 Android开发基础 实验内容 基于Android Studio开发简单的Android应用并部署测试; 了解Android组件.布局管理器的使用: 掌握Android中事件 ...
- 20145215《Java程序设计》第3周学习总结
20145215<Java程序设计>第三周学习总结 教材学习内容总结 认识对象 类类型 在学习第三章的时候,我们知道Java可区分为基本类型和类类型两大类型系统,其中类类型也称为参考类型. ...
- 分享一个JavaScript嗅探工具Tracker
今天发现一个好用的JS侦测工具,实时监测JS代码的使用效率,运行状态等. 期待插件作者添加更好的功能. 运行效果 运行效果如下(我把它放到标签里了): 1.点击Tracker书签工具 2.选择查看选项 ...
- window下为apache配置ssl证书
转载自 子非鱼 的博客稍作修改 第一步:依赖 配置Apache服务器支持https协议和SSL证书,最基本的要求是Apache包含openssl模块.还好apache/bin目录下有libeay32. ...
- 关于opacity透明度子元素继承现象的若干研究以及hack方法
[感想]信息时代的信息是有时效性的,今天是确确实实感受到了.互联网资料虽然丰富,但是质量不一,还有大量的跟风雷同,很多人都是随手拷贝过来,根本没有实践.以前端为例,这两年浏览器的迅猛发展,造成很多原有 ...
- BACKBONE源代码解析
//2014.11// Backbone.js 1.0.0 // (c) 2010-2013 Jeremy Ashkenas, DocumentCloud Inc. // Backbone may b ...
- zoj3890 BFS
就是搜. #include<stdio.h> #include<string.h> #include<queue> using namespace std; #de ...
- url的编码问题
JQuery中 编码 var url = 'folder/index.html?param=#23dd&noob=yes'; var encodedUrl = encodeURICompone ...
- POJ3233 Matrix Power Series
Description Given a n × n matrix A and a positive integer k, find the sum S = A + A2 + A3 + … + Ak. ...