jQuery的核心方法
一、.each() 方法规定为每个匹配元素规定运行的函数。
语法:
$(selector).each(function(index,element))
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
<script>
$('li').each(function(index,node){
console.log(index+":"+node.innerText)
})
</script>
运行后:
image.png
二、$.extend()函数用于将一个或多个对象的内容合并到目标对象。
<script>
var obj1 = {
name : 'lili',
age : 20,
address : 'beijing'
}
var obj2 = {
name : 'lucy',
sex : '女',
job : 'teacher'
}
var obj3 = $.extend(obj1,obj2);
console.log(obj3);
</script>
输出:
image.png
三、.clone()方法生成被选元素的副本,包含子节点、文本和属性。
语法:
$(selector).clone(includeEvents)
includeEvents可选。布尔值。规定是否复制元素的所有事件处理。
默认地,副本中不包含事件处理器。
<div class="box1">
<p class="text1">aaa</p>
</div>
<div class="box2"></div>
<script>
$('.box1').clone().appendTo('.box2');
</script>
image.png
四、.index()方法返回指定元素相对于其他指定元素的 index 位置。这些元素可通过 jQuery 选择器或 DOM 元素来指定。如果未找到元素,index() 将返回 -1。
<ul>
<li id="one">1</li>
<li>2</li>
<li id="two">3</li>
<li>4</li>
<li>5</li>
</ul>
<script>
console.log($('li').index());
console.log($('#two').index());
</script>
输出:
image.png
五、.ready()当DOM准备就绪时,指定一个函数来执行
//写法1
$.ready(function(){
})
//写法2
$(function(){
})