脚本语言_jquery_java_web.docVIP

jQuery介绍 1.特点： 利用选择器(借鉴了css选择器的语法)查找要操作的节点(dom对象)， 并且将查找到的节点(1个或者多个封装成一个jQuery对象)。 这样做的好处有两个： a. 代码的兼容性更好： 不再直接调用节点的属性或者方法，而是通过调用jQuery对象的属性或方法 来实现对底层被封装的节点的操作。 jQuery对象已经考虑到了不同的的浏览器之间的差异性。 b. 代码更简洁： jQuery对象提供的方法或者属性能做更多的事件。 2.编程的基本步骤 step1. 利用选择器来查找要操作的节点 step2. 调用jQuery对象的方法或者属性 3.jQuery对象与dom对象之间的转换 a. dom对象 jQuery对象 var obj = document.getElementById(d1); var $obj = $(obj); $obj.html(hello jQuery); b. jQuery对象 dom对象 var $obj = $(#d1); // var obj = $obj.get()[0]; // var obj = $obj[0]; var obj = $obj.get(0); obj.innerHTML = hello java; 选择器 jquery选择器 1)理解选择器及优势： 类似于css选择器(定位元素，施加样式)， jquery选择器(定位元素，施加行为)。 这样做，可以内容与行为分离 2)基本选择器 s1.html #id .class element selector1,selector2..selectorn * 3)层次选择器 s2.html select1 select2 查找所有与select2匹配的后代 select1select2 只查找子节点,不包含孙子。 select1+select2 下一个兄弟，必须相邻。 select1~select2 下面所有的兄弟 4)过滤选择器 (1)基本过滤选择器 s3.html :first :last :not(selector) :even :odd :eq(index) :gt(index) :lt(index) (2)内容过滤选择器 :contains(text) 匹配包含给定文本的元素 :empty 匹配所有不包含子元素或者文本的空元素 :has(selector) 匹配含有选择器所匹配的元素的元素 :parent 匹配含有子元素或者文本的元素 (3)可见性过滤选择器 :hidden 匹配所有不可见元素，或者type为hidden的元素 :visible 匹配所有的可见元素 (4)属性过滤选择器 [attribute] [attribute=value] [attribute!=value] (5)子元素过滤选择器 :nth-child(index/even/odd) //下标从1开始。 //index:表示对应位置的子元素。 //even:偶数 //odd:奇数 (6)表单对象属性过滤选择器 :enabled :disabled :checked :selected 5)表单选择器 :input 包含下拉列表 :text :pasword :radio :checkbox :submit :image :reset :button :file :hidden dom操作 1. 查询 找到节点之后，可以读取或者修改节点的html内容、文本内容、value值和属性值。 html() : 读取或者修改节点的html内容，会包含其中的标签。 text() : 读取或者修改节点的文本内容，不会包含其中的标签。 val() : 读取或者修改节点的value属性值。 attr() : 读取或者修改节点的属性。 2. 创建 $(html): $(div id=d1new Div/div); 3. 插入节点 append($obj); append(div id=d1new Div/div); append():作为最后一个孩子插入 prepend():作为第一个孩子插入 after():作