jQuery笔记-常用方法

jQuery常用方法

选取被选中的Select的optioin需要使用选取子节点的方式：
$("select['test']空格 :selected").each(function(){
//空格的作用是选择select['test']的所有子元素
});

click方法

jQuery对象会进行隐式迭代,
比如下面操作会为所有的p元素节点添加onclick处理函数。
$("p").click(function(){
console.log($(this).text());//输出每个p元素的值
});
当然上面的对象也可以写成：
$("p").each(function(){
this.onclick = function(){
console.log(this.firstChild.nodeValue)
}
})

.val()

如果有参数，则将参数设置为 文本框的值 $("input").val();

如果没有参数，则读取文本框的内容。$("input").val("hello");

.text()

注意与val()函数的区别，val用于文本框，而text用户p等文本。如果没有参数，则返回 元素的文本内容。例如$("p").text()

如果有参数则将参数设置为对应文本的内容。$("p").text("data") 将p元素的文本设置为data

.attr()

如果有一个参数，返回元素的属性值 $("img").attr("src"),取得图片的src属性
如果有多个参数，则为设置属性的值
$("img").attr({src:"test.jpg", alt:"test image"});

.each()

对获取的对象数组进行迭代，函数中的this指向的是dom对象。
$("p").each(function(){
this.onclick = function(){
console.log(this.firstChild.nodeValue)
}
})

css方法举例

attr(name|pro|key,val|fn) 通过统一的属性方法可以对class进行操作
removeAttr(name) 
下面三个方法虽然效果是一样的，但是比attr更专业。
addClass(class|fn) 添加样式
removeClass([class|fn]) 去除样式
toggleClass(class|fn[,sw]) 添加去除toggle样式

$("div:first").css("opacity", 0.5);
$("div:first").width() 读取宽度
$("div:first").height(400) 设置高度

<完>