JQuery

5.临近选择器:

$("mix+mix"),选取下一个兄弟节点. 如:$("div +#test"),id为test的的节点必 须是div的下一个兄弟节点
6.属性选择器:

$("mix[@attr]"):选取所有该mix且具有attr属性的节点 $("mix[@attr=a_value"]):选取所有该mix且具有attr属 性并满足属性值为a_value的节点 $("mix[@attr^=a_value_head"]):attr属性的属性值是 以a_value_head开头的 $("mix[@attr$=a_value_end"]):attr属性的属性值是以 a_value_end结尾的 $("mix[@attr*=a_value"]):attr属性的属性值中包含 a_value
选择器

1.基本选择器(3种): $("标签名"),如$("p")是选取了所有的p标签节点 $("#id名"),如$("#test")是选取了id为test的标签 节点 $(".class名"),如$(".test")是选取了所有class为test 的标签节点
2.组选择器:

下面还是现做一个约定:把"标签名或#id名 或.class名"记作mix,则mix表示一个标签名, 或一个#id或一个.class. $("mix,mix,mix,..."), 如:$("div,#test1,p,.test2,#test3")
JQuery对象访问




each(callback) ：以每一个匹配的元素作为 上下文来执行一个函数 。 见each--find.html size() ：jQuery 对象中元素的个数 <img src="test1.jpg"/> <img src="test2.jpg"/> $("img").size();
使用JQuery的优点
程序员：简化javascript和ajax编程，能够使 程序员从设计和书写繁杂的JS应用中解脱出 来，将关注点转向功能需求而非实现细节上， 从而提高项目的开发速度。 用户：改善了页面视觉效果，增强了与页面 的交互性，体验更绚丽的网页物资。
主流的JavaScript框架

DOM文档处理


内部插入 append(content), appendTo(content), prepend(content), prependTo(content). 外部插入 after(content), before(content), insertAfter(content), insertBefore(content).
JQuery介绍
JQuery概述
jQuery由美国人John Resig于2006年初创建，至今 已吸引了来自世界各地的众多javascript高手加入其 team。 jQuery是一个快速的，简洁的javaScript库，使用户 能更方便地处理HTML documents、events、实现动 画效果，并且方便地为网站提供AJAX交互。 jQuery能够使用户的html页保持代码和html内容分 离，也就是说，不用再在html里面插入一堆js来调 用命令了，只需定义id即可。
class
addClass(class):为每个匹配的元素添加指定的 class removeClass(class):从所有匹配的元素中删除 全部或者指定的class toggleClass(class) :如果存在（不存在）就删 除（添加）一个类 toggleClass(class, switch) :如果开关switch参 数为true则加上对应的class，否则就删除
$(document).ready(function() {}); 可简写为：$(function(){}); 见helloworld.html
核心函数
$(expression,[context]) 接收一个包含 CSS 选择器的字符串，然后用这个 字符串去匹配一组元素 jQuery 的核心功能都是通过这个函数实现的 见$(expression,[context]).html $(html) 根据提供的原始 HTML 标记字符串，动态创建由 jQuery 对象包装的 DOM 元素 见$(html).html
HTML
html() 取得第一个匹配元素的html内容 html(val) 设置每一个匹配元素的html内容
文本
text(): 取得所有匹配元素的内容。 text(val): 设置所有匹配元素的文本内容
值
val() 获得第一个匹配元素的当前值 val(val) 设置每一个匹配元素的值
jQuery下载和安装
当前版本1.3.3 官方网站下载：http://jquery.com/ 在页面头部head中，添加js <script type="text/javascript" src="./script/jquery.js"></script>

页面载入
window.onload方法长久以来是程序员解决 客户端页面载入问题的一个方法，只有少数 大型的图片文件会被快速的载入，而大部分 大型的图片文件会使window.onload()载入的 很慢.jQuery有一个用来作为DOM快速载入 javascript的得心应手的小函数,那就是ready
属性
attr(name):取得第一个匹配元素的属性值 attr(properties):将一个“名/值”形式的对象设置为 所有匹配元素的属性 attr(key,value)为所有匹配的元素设置一个属性值 attr(key, fn) ：为所有匹配的元素设置一个计算的属 性值 removeAttr(name) :从每一个匹配的元素中删除一个 属性
4.子选择器:

$("mix>mix"),这个放在后代选择器后面是为了 和它做对比.子选择器只能选择第一代子代.不 处理深层嵌套.例子: $("div>.test") <div><p class="test"></p></div>对这里的 p段落标签有效.但对 <div><p><p class="test"></p></p></div> 对这里的p段落标签无效,这里要用 $("div .test)
$的其他用法:

$(document):网页文档对象 $(document.body):网页body对象,和$("body")是一 样的 $(函数):DOM载入后就执行该函数.所以 $(document).ready()可以写做$() $(选择器部分,选择器来源):这个举例说明 $("input:radio",document.forms[0]):在文档的第一 个表单中,搜索所有单选按钮 $("div",xml.responseXML):查询指定XML文档中的 所有div元素 选择器来源可以是:作为上下文的DOM元素,文档或 jQuery对象
7.进一步选择器:

具有限定子节点选择器:$("mix1[mix2]"): 返回包含mix2的mix1节点.如:$("div[a]"): 包含a标签的div. 这个和$("div a")不相同.后者表示div中的 a标签,返回的是a标签对象,前者返回的是 div标签对象

YUI Dojo mooTools Prototype jQuery
JQUERY的特点



轻量级：经GZip压缩后传输的代码文件仅14KB， 未经压缩传送的代码文件仅26KB 链式语法 ： $("p.surprise").addClass("ohmy").show("slow"); CSS 1-3 选择器：支持CSS选择器选定DOM对象 跨浏览器：支持Internet Explorer 6+、Opera 9+、 Firefox 1.5+、Safari 2+ 简单：较其它JS库更容易入门，中、英文档很齐全 易扩展： JQuery UI 、 JQuery FX –已经有很完 善的基于JQuery的用户界面库 和网页特效库
get() ：取得所有匹配的 DOM 元素集合 <img src="test1.jpg"/> <img src="test2.jpg"/> $("img").get().reverse(); get(index) ：取得其中一个匹配的元素 $("img").get(0);



index(subject) ：搜索与参数表示的对象匹 配的元素，并返回相应元素的索引值 。 <div id="foobar"><div></div><div id="foo"></div></div> $("div").index($('#foobar')[0]) // 0 $("div").index($('#foo')[0]) // 2 $("div").index($('#foo')) // -1
表单选择器:
E:input:选择表单元素(input,select,textarea,button) E:text:选择所有文本域(type="text") E:password:选择所有密码域(type="password") E:radio:选择所有单选按钮(type="radio") E:checkbox:选择所有复选框(type="checkbox") E:submit:选择所有提交按钮(type="submit") E:image:选择所有图像域 (type="image") E:reset:选择所有清除域(type="reset") E:button:选择所有按钮(type="button") 当然包括E:hidden
$(elements) 将一个或多个DOM元素转化为jQuery对象 注 意是jQuery对象，而不是DOM对象。如果我 想得到DOM对象呢？很简单，只需在其后跟 一个索引值（如[0]）—因为它得到的是一个 对象数组，即可得到DOM对象。然后就可以 使用innerHTML、innerText等DHTML方法和 属性了。
冒号限定结点选择器:$("mix:condition"):mix标签,并且满足限 定条件. E:root:类型为E,并且是文档的根元素 E:nth-child(n):是其父元素的第n个类型为E的子元素 ,基数从 1开始 E:first-child:是其父元素的第1个类型为E的子元素 E:last-child:是其父元素的最后一个类型为E的子元素 E:only-child:且是其父元素的唯一一个类型为E的子元素 E:empty:没有子元素（包括text节点）的类型为E的元素 E:enabled E:disabled:类型为E,允许或被禁止的用户界面元素
3.后代选择器:

ቤተ መጻሕፍቲ ባይዱ

$("mix mix"),当然可以是多个嵌套,但后 代选择器可以是深层子代,所以$("mix mix mix ...")这种写法作用不大. 例子:$("div .test"):在div标签内的所有具 有test的class的后代元素(就是被div嵌套 的class属性为test的标签)




replaceWith(content) :将所有匹配的元 素替换成指定的HTML或DOM元素 . replaceAll(selector) :用匹配的元素替换 掉所有 selector匹配到的元素 empty() :删除匹配的元素集合中所有的 子节点 remove([expr]) :从DOM中删除所有匹配 的元素

E:checked:类型为E,处于选中状态的用户界面元素 E:visible:选择所有可见元素 E:hidden:选择所有隐藏元素 E:not(s):类型为E,不匹配选择器s E:eq(n),E:gt(n),E:lt(n):元素限定 E:first:相当于E:eq(0) E:last:最后一个匹配的元素 E:even:从匹配的元素集中取序数为偶数的元素 E:odd:从匹配的元素集中取序数为奇数的元素 E:parent:选择包含子元素（包含text节点）的所有 元素 E:contains('test'):选择所有含有指定文本的元素