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(){

        })

 

 

posted @ 2019-10-31 23:52  江湖艺人  阅读(132)  评论(0编辑  收藏  举报