1.首先来看看jquery.attr() 和 jquery.prop()的应用及 区别:
attr是jQuery版本就有的函数,prop是jQuery 1.6版本新增的函数。毫无疑问,在1.6之前,你只能使用attr
函数;1.6及以后版本,你可以根据 实际需要选择对应的函数。
它们有什么区别呢?
简单的来说:(1)对于HTML元素本身就带有的固有属性,在处理时,使用prop方法。
(2)对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法。
像checkbox,radio和select这样的元素,选中属性对应“checked”和“selected”,这些也属于固有属性,因此需要使用prop方法去操作才能获得正确的结 果。
<input id="id" type="checkbox" checked="checked" />
$("#id").prop("checked")==true
$("#id").attr("checked")=="checked"
可以看出:prop返回的是boolean; attr返回的是String
都可以用来获取值,也可以用来赋值
赋值
$("#id").prop("color","FF0000");
$("#id).attr("","");
获取
$("#id").attr("");
2. attr()和val()
$(this).attr(key); 获取节点属性名的值,相当于getAttribute(key)方法
$(this).attr(key, value); 设置节点属性的值,相当于setAttribute(key,value)方法
$(this).val();获取某个元素节点的value值,相当于$(this).attr(“value”);
$(this).val(value);设置某个元素节点的value值,相当于$(this).attr(“value”,value);
区别:
.val() 能够取到 针对text,hidden可输入的文本框的value值。
而 .attr('value') 可以取到html元素中所设置的属性 value的值,不能获取动态的如input type="text" 的文本框手动输入的值。
3.在来看看.children()和.find()的区别
.children(selector) 方法是返回匹配元素集合中每个元素的所有子元素(仅儿子辈)。参数可选,添加参数表示通过选择器进行过滤,对元素进行筛 选。
.find(selector)方法是返回匹配元素集合中每个元素的后代。参数是必选的,可以为选择器、jquery对象可元素来对元素进行筛选。
.find() 与 .children() 方法类似,不同的是后者仅沿着 DOM 树向下遍历单一层级。只在有一级遍历
4. .parent():查找每个段落的带有 "selected" 类的父元素:
<div><p>Hello</p></div>
<div class="selected"><p>Hello Again</p></div>
<script>
$("p").parent(".selected").css("background", "yellow");
</script>
5. .each 遍历
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("li").each(function(){
alert($(this).text())
});
});
});
</script>
<li>Coffee</li>
<li>Milk</li>
<li>Soda</li>
依次弹出coffee,milk,soda