jQuery 是一个 JavaScript 函数库
核心理念是 write less, do more
优势
-
对DOM操作做了终极简化
-
屏蔽了浏览器的兼容性问题
添加jQuery
引入jQuery.js、编写自定义脚本，两种方式：
-
将jQuery.js下载到服务器本地，在script中使用服务器路径
<head><script type="text/javascript" src="jquery.js"></script></head> -
使用CDN网络上共享的jquery.js，使用最多
工厂函数 $( )
$( )：在样式表中的选择符都可以放到括号内，如：
DOM document.getElementById('myList')
jQuery $("#myList")
jQuery选择器
基本选择器
$("#id")、$(".class")
层级选择器
$(".c1 div")
jQuery遍历
$("...").next、$("...").prev 紧邻的前一个元素或者后一个元素$("...").nextAll、$("...").prevAll 之前或者之后的所有元素$("...").siblings() 除自己之外的所有兄弟
jQuery HTML
访问/修改元素属性
获取 $("...").attr("属性名")
修改 $("...").attr("属性名",值)
访问/修改元素内容
html() 读取或修改节点的HTML内容
获取<p>元素的HTML代码 $("p").html()
设置<p>元素的HTML代码 $("p").html("<div>文本</div>")
text() 读取或修改节点的文本内容
获取<p>元素的文本 $("p").text()
设置<p>元素的文本 $("p").text("文本")
val() 读取或修改节点的value属性值
获取按钮的value值 $("input").val()
设置按钮的value值 $("input").val("文本")
访问/修改元素样式
直接修改css属性
获取css样式（计算后的样式） $("...").css("css属性名")
修改css样式 $("...").css("css属性名", 值)
通过修改class批量修改样式
-
判断是否包含指定class
$("...").hasClass("类名") -
添加class
$("...").addClass("类名") -
移除class
$("...").removeClass("类名")
添加元素
-
创建新元素
var $new = $("html代码片段") -
将新元素结尾添加到DOM树
$parent.append($new)
删除元素
$("...").remove() 如：
获取第二个<li>元素节点后，将它从网页中删除 $("ul li:eq(1)").remove()
把<li>元素中属性title不等于“菠萝”的<li>删除 $("ul li.").remove("li[title!=菠萝]")
jQuery事件
事件绑定
语法： $("...").bind("事件类型", function(e){...})，如：$("...").bind("click", function(e){...})，简写 $("...").click(function(e){...})
事件对象
e 事件对象，包含与事件相关的信息，记录事件发生时的鼠标位置、键盘按键状态和触发对象等信息，如：clientX/offsetX/pageX/screenX/x: 事件发生时的X坐标keyCode：键盘事件中按下的按键的值
1883
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
