锋利的jquery总结

来源：互联网发布：picasa mac 编辑：程序博客网时间：2024/04/27 17:36

一第一章简介和简单演示例子

1 官网地址和解释

http://jquery.com

分为压缩和非压缩，压缩的小，适合做产品，非压缩的适合开发

2 js自动载入程序方法

window.onload=function()

{

alert(“hello”);

}

3 区别有无空格的样式的定义组件$("div #a")和$("div#a")

有空格是其下面，没有空格是其本身

<!DOCTYPE html PUBLIC "-//W3C//DTDXHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<htmlxmlns="http://www.w3.org/1999/xhtml">

<head>

<scriptsrc="../scripts/jquery-1.3.1.js"type="text/javascript"></script>

<scripttype="text/javascript">

//等待dom元素加载完毕.

$(document).ready(function(){

alert("HelloWorld!");

$("div#a").css("color","red");

//$("div#a").css("color","red");

});

</script>

</head

<body>

hello

demo

</div>

</body>

</html>

二 jquery强大选择器（过滤器以：开头）

1 常用选择—5种--标签（div），#id，.class, *(选择所有),以逗号隔开

//* 表示所有的

逗号表示多个或者关系的

2 层次过滤—4种—（父子）--空格(多个多层)，>（多个单层）,+（后单个同辈），~（多个后同辈），

空格：后代说有

>:子类只是儿子部分

+ 选择下一个同辈份的元素（next），可以是不同元素

~ 多个后同辈

3 常用过滤—11种—（大小位置）--针对自--:first,:last,:not(常用选择器)，:even,:odd,:eq(index),:lt(index),

:gt(index),:header(。。。例如h1，h2)，:animated,:focus

：odd:基数的,索引0开始的

：even：偶数的

很好理解的

4 内容过滤—4种—:contains()文本内容，:has()标签，:empty没有内容(文本算内容),:parent(有子元素的，包含文本text)

5 可见过滤—2种--:visible,hidden

6 属性内容--8种-[id]（包含id属性），[id=a],[id!=a](不等),[id^=a]开头，$结尾，*（包含a即可）,~（以空格分隔的），[][][]多个都满足条件的

1 实例：div[title~=bw]title包含，并且用空格分隔开来的

<scriptsrc="../scripts/jquery-1.3.1.js"type="text/javascript"></script>

<scripttype="text/javascript">

//等待dom元素加载完毕.

$(document).ready(function(){

//alert("HelloWorld!");

$("div[title~=bw]").css("color","red");

//$("div:last").css("color","red");

//$("div#a").css("color","red");

});

</script>

</head

<body>

hello

demo

</div>

7 子元素—4种—带分隔空格:last-child,

first-child,only-child,nth-child(序号，基偶)

和层次过滤的最大区别是，他是子元素，而层次例如 :first

层次是本层同辈的，不好说，有空格就是下面，没空格就是自己

$("div:nth-child(even)").css("color","red");

8 表单动作过滤—4种--:enabled,disabled,:checked(单选复选),:selected（下拉列表）

9 表单对象专门的—11种--:input,:text,:password,:radio,:checkbox,:submit,

:image,:reset,:button,:file,:hidden

三 dom操作查找，建立，插入，删除，复制，替换，包裹，操作属性和操作样式，遍历,偏移量

1 查找内容和属性text(),attr()

2 建立

Var $li = $(“<li><li>”)

3 插入节点 8个

Append,appendTo,prepend,prepedTo,afterinsertAfter before,insertBefore

4 删除3个

Remove,detch,empty

5 colne 复制 1个

6 替换 replacewith/replaceAll 方向不同

7 包裹3个wrapAll （只一个）wrap（符合的都包括），wrapInner（内部）

8 操作—获取和设置 text,html,value(带value属性的)

9 样式操作

A：获取和设置attr(a),attr(a,b)

B：追加 addClass(a)同时包含了原来的样式

10 遍历节点—7个

Children，next，prev，siblings，parent，parents，closest

10 3个综合方法

Offset(left,top),position(left,top),scrollTop,scrollLeft

0 0