jQuery版本”1.6.3” (jQuery.fn.jquery)

一、解决jQuery和其他库的冲突

1、jQuery库在其他库之后导入

  • 使用jQuery.noConflict();将变量$的控制权移交给其他的js插件
//使用jQuery
jQuery(document).ready(function(){
	...
});
  • 重新定义jQuery快捷方式:var $j = jQuery.noConflict();
//自定义jQuery快捷方式
$j(function(){
	...
});

//使用其他js插件
$("p")...
  • 使用闭包
jQuery(function($){
	//在函数内部继续使用$
	$("p")...
});

//使用其他js插件
$("p")...

(function($){
	$(function(){
		...
	});
})(jQuery);

//使用其他js插件
$("p")...

2、jQuery库在其他库之前导入

可以直接使用jQuery来做一些jQuery的工作。同时,也可以使用$()方法作为作为其他库的快捷方式。这里无需调用jQuery.noConflict()函数。

jQuery(function(){
	jQuery('p')...
});

//使用其他js插件
$("p")...

二、Javascript库

  • Prototype

    Prototype去除了客户端Web编程的复杂性,对DOM操作和Ajax提供了优雅的API。

    PrototypeJs

  • Dojo

    Dojo是一个Javascript工具包,提供构建Web app需要的任何东西:语言工具、UI组件等,节省开发时间。

    DojoToolkit

  • YUI(Yahoo UI)

    YUI是一个用来构建具有丰富交互的Web应用的JavaScript和CSS库。

    YUI

  • Ext js

    Ext Js是构建数据密集型Web app的最好的JavaScript框架,它拥有一套非常大的UI组件。

    ExtJs

  • MooTools

    MooTools是给高级JavaScript开发者使用的一套JavaScript工具,它为你提供了优雅的、清晰的API和非常完整的文档来书写强大灵活的代码。

    MooTools

  • jQuery

    jQuery官网

三、jQuery开发工具和插件

  • Dreamweaver

  • Aptana

  • Eclipse + jQueryWTP插件或Spket插件

  • Visual Studio

  • 其他文本编辑器

四、jQuery选择器

1、基本选择器

  • ID选择器:#id

  • 类选择器:.class

  • 元素选择器:Element

  • 选择所有元素:*

  • 群组选择器:Selector1,Selector2,...,SelectorN

检查某个元素是否存在时,应该根据获取到的元素的长度或转换为DOM对象来判断:
if($("#elm").length > 0){
	//do something
}
//或
if($("#elm")[0]){
	//do something
}

2、层级选择器

  • 后代选择器:$("ancestor descendant")

  • 子元素选择器:$("parent>child")

  • 同级选择器

    $("prev+next")

    $("prev~siblings")

3、过滤选择器

  • 基本过滤选择器

    :first
    :last
    :not(selector)
    :even
    :odd
    :eq(index)
    :gt(index)
    :lt(index)
    :header:选择所有标题元素(h1 - h6)
    :animated:选择当前的动画元素
    :focus

  • 内容过滤选择器

    :contains(text)
    :empty
    :has(selector)
    :parent:选取是parent的元素,即含有子元素或者文本的元素

  • 可见性过滤选择器

    :hidden
    :visible

  • 属性过滤选择器

    [attribute]
    [attribute=value]
    [attribute!=value]
    [attribute^=value]
    [attribute$=value]
    [attribute*=value]
    [attribute|=value]:选取属性等于给定字符串或以该字符串为前缀(该字符串后跟一个连字符”-“)的元素
    [attribute~=value]:选取属性用空格分隔的值中包含一个给定值的元素
    [attribute1][attribute2][sttributeN]

  • 子元素过滤选择器

    :nth-child(index/even/odd/equation):nth-child(0/even/odd/3n+1)
    :first-child
    :last-child
    :only-child:属于某个父元素的唯一一个子元素

  • 表单对象属性过滤选择器

    :enabled
    :disabled
    :checked
    :selected

4、表单选择器

:input:选取所有的<input>、<textarea>、<select>和<button>元素
:text
:password
:radio
:submit
:image
:reset
:button
:file
:hidden

5、特殊符号处理

选择器中含有特殊符号(“.”、”#”、”[“等)使用”\“转义

<div id="id#b"></div>
$("#id\\#b")