1. JQ中的遍历
-
each() ★★★★★
-
回调函数的两个参数
-
this指向
-
return false;
<script>
$('li').each(function(i,ele) {
//alert(i)
//ele:原生的元素↓
ele.style.background = 'red'
$(ele).css('background','red')
})
</script>
eg.
<body>
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</body>
<script>
$('li').each(function(i,ele) {
$(ele).html(i)
// $(this).html(i)也可以
// ele.innerText = i 也可以
})
</script>
<body>
<ul>
<li>0</li>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</body>
return false 跳出遍历操作(相当于 原生中的break)|| 单用 return可没这效果！！， 例如
$('li').each(function(i,ele) {
$(ele).html(i)
if (i == 2) return false
}）
结果为：
2.JQ包装对象
-
wrap() ★★★
-
wrapAll() 整体包装 ★span span span | p
-
wrapInner() 内部包装 ★
-
unwrap() 删除父级（除了body） ★
-
例子 : 管理员与普通用户状态控制
-
<!-- warp() 包裹 -->
<script>
// $('ul').wrap('<div id="nav">')
$('ul').wrap('<div id="nav"></div>')
</script>
3. get() 把jQ对象转换成js对象，默认获取的是一个原生集合，传入参数，可以找到指定项
-
与eq的区别 eq（）得到仍是jq对象
$('div').get(0).innerHTML
$('div').eq(0).html()
-
为什么要转，比如：
-
获取内容的高度
原生中的 .scrollHeight 可以获取标签内容的高度
alert( $('textarea').get(0).scrollHeight) -> 文本域内容高度
alert($('textarea).height()) ->文本域设置的高度
-
元素之间的比较
栗子暂时不太好，有两点注意：
console.log([] == []) -> false
console.log({} == {}) -> false
