jQuery
这东西出来很久了,一般来说都用过。提供一个速查地址
jQuery 简介
jQuery 设计的宗旨是“write Less,Do More”,即倡导写更少的代码,做更多的事情。
jQuery 是一个跨浏览器(兼容所有常见浏览器,包括IE6)的工具库。
提供了元素选取、元素操作、CSS操作、事件处理、动画、AJAX等功能。
jQuery 的特点
- 链式操作(很优秀)
- 高效、灵活的选择器(id、class、tag、伪元素、attr、层级)
- 插件机制
- 兼容主浏览器,提供了统一的功能接口
jQuery 插件机制
jQuery.fn.extend(object)对应$('div').的操作。
jQuery.fn.extend({ check: function() { return this.each(function() { this.checked = true; }); }, uncheck: function() { return this.each(function() { this.checked = false; }); } }); $("input[type=checkbox]").check(); $("input[type=radio]").uncheck();
2.jQuery.extend(object) 对应 $. 的操作。
jQuery.extend({ min: function(a, b) { return a < b ? a : b; }, max: function(a, b) { return a > b ? a : b; } }); jQuery.min(2,3); // => 2 jQuery.max(4,5); // => 5
jQuery.extend([deep], target, object1, [objectN])
用一个或多个其他对象来扩展一个对象,返回被扩展的对象。如果不指定target,则给jQuery命名空间本身进行扩展。这有助于插件作者为jQuery增加新方法。
如果第一个参数设置为true,则jQuery返回一个深层次的副本,递归地复制找到的任何对象。否则的话,副本会与原对象共享结构。 未定义的属性将不会被复制,然而从对象的原型继承的属性将会被复制。
jQuery 选择器
- 基本
#id、element、.class、*、selector1,selector2,selectorN
- 层级
ancestor descendant、parent > child、prev + next、prev ~ siblings
- 基本筛选器
:first、:not(selector)、:even、:odd、:eq(index)、:gt(index)、:lang1.9+、:last、:lt(index)、:header、:animated、:focus、:root1.9+、:target1.9+
- 内容
:contains(text)、:empty、:has(selector)、:parent
- 可见性
:hidden、:visible
- 属性
[attribute]、[attribute=value]、[attribute!=value]、[attribute^=value]、[attribute$=value]、[attribute*=value]、[attrSel1][attrSel2][attrSelN]
- 子元素
:first-child、:first-of-type1.9+、:last-child、:last-of-type1.9+、:nth-child、:nth-last-child()1.9+、:nth-last-of-type()1.9+、:nth-of-type()1.9+、:only-child、:only-of-type1.9+、
- 表单
:input、:text、:password、:radio、:checkbox、:submit、:image、:reset、:button、:file
- 表单对象属性
:enabled、:disabled、:checked、:selected
- 混淆选择器
$.escapeSelector(selector)3.0+
这个方法通常被用在类选择器或者ID选择器中包含一些CSS特殊字符的时候,这个方法基本上与CSS中CSS.escape()方法类似,唯一的区别是jquery中的这个方法支持所有浏览器。
jQuery()
核心函数,我认为这是很优秀的一个点。小小的$函数,包含了我们想要的大多数功能。
jQuery(Function)
等价于$.ready(Function)
当DOM载入就绪执行一个函数回调。可以避免当页面DOM还没有加载就操作了DOM。(会报错)
简单地说,这个方法纯粹是对向window.load事件注册事件的替代方法。不同的是可以绑定多次(addEventListener也可以绑定多次)。ready如果页面加载完成之后,还会继续调用(load不会)
jQuery(element)
将原生DOM转换为jQuery封装的DOM。
也可以传入一个elementArray,来批量转换一组原生DOM
传入一个选择器,并且可以限制范围。返回一组匹配的元素。
jQuery(html,[ownerDocument])
据提供的原始 HTML 标记字符串,动态创建由 jQuery 对象包装的 DOM 元素。同时设置一系列的属性、事件等。
也可以用来处理XML
$.fn.attr()、$.fn.prop()、$.fn.data()
$.fn.attr()
设置或返回被选元素的属性值。比如href,src,id,class
对应attribute
$.fn.prop()
设置或返回被选元素的状态值。可以理解为原始值、状态。比如checked、disabled
对应properties
$.fn.data()
早期是直接绑定在DOM对象上的。
目前如果浏览器支持HTML5,会在DOM元素上data-*读取和存储。
data-* 也可以DOM方法dataset来读取或修改。
$.fn.get()、$.fn.eq、[]
$.fn.get()等价于[]
get获取到的是真是的DOM
eq获得到的还是jQuery包裹的DOM对象。相应的,还有其他方法可以获取。
html()、text()、val()
html()对应innerHTML
text()对应innerText
val()对应value


