浅谈jQuery中的工具方法

发布时间:2019-05-21 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了浅谈jQuery中的工具方法脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
<div id='d1'>Hello</div>
<div>Hi</div>
<div>MyName</div>
<div>What</div>
<div>where</div>

<script>
    console.log($('div').length);//5
</script>
  • get(index):index表示传入的索引值,根据传入指定的索引值在一个集合中找元素
<div>hello</div>
<div class='c1'>hi</div>
<div>good</div>

<script>
    console.log($('div').get(1));//找到的是class为c1的元素
</script>
  • $().index(element):该方法只能jQuery对象调用,括号接收的参数也只能是jquery对象,找到返回该元素所在的索引值位置,找不到返回-1
<div id='d1'></div>
<div></div>
<div></div>

<script>
   console.log($('div').index($('#d1')));//找到的是索引值为0
</script>
  • $.inArray(value,array,FromIndex)方法:主要获取传入的元素在一个集合中的位置,找到返回该位置对应的索引值,找不到返回-1;value传入的必须不能是jquery对象;array传入的可以为jQuery对象也可以是DOM对象,还能传入数组
<div>Hello</div>
<div class='c1'>Hi</div>
<div>Good</div>

<script>
    console.log($.inArray(document.getElementsByclassname('c1')[0],$('div')));//找到的是索引值为1
</script>
  • $().toArray()方法:只能传入一个jQuery对象,把一个jQuery对象转换成数组形式
<div class='c1'>Hello</div>
<div>good</div>
<div>ok</div>

<script>
    console.log($('div').toArray());//输出结果:[div.c1, div, div,]
</script>
  • $.makeArray(obj)方法:传入的是一个对象,可以是jQuery对象,也可以是DOM对象,然后会返回一个数组形式的集合
<div>Hello</div>
<div class='c1'>Hi</div>
<div>Good</div>

<script>
    console.log($.makeArray($('div')));//输出结果:[div, div.c1, div]
</script>
  • $():工厂函数的调用,返回jQuery对象;$.inArray():也是一个对象,jQuery的全局对象
  • each(function(index,domElement){}):可以用它来遍历一个jQuery对象的集合,遍历完成之后,返回的是DOM对象,index返回的是索引值,domElement返回的是索引值对应的元素
<div>html</div>
<div>css</div>
<div>javascript</div>

<script>
    var $divs=$('div');
    $divs.each(@H_512_495@function(index,domElement){
        console.log(index,domElement);
    /*输出结果:0   <div>html</div>
               1   <div>css</div>
               2   <div>javascript</div>*/    
    });
</script>
  • $.each(obj,function(index,domElement){}):可以用来遍历一个类数组对象的集合,obj传入的可以是jQuery对象,也可以是dom对象,index可以获取对应的索引值,domElement获取的是索引值对应的元素,返回的是DOM对象
<div>Hello</div>
<div>Hi</div>
<div>good</div>

<script>
    $.each($('div'),function(index,domElement){
        console.log(index,domElement);
        /*
        输出结果:  0  <div>Hello</div>
                   1  <div>Hi</div>
                   2  <div>good</div> 
        */
    })
</script>
var str='  good   morning   you   ';
console.log($.trim(str));//输出结果:good   morning   you

脚本宝典总结

以上是脚本宝典为你收集整理的浅谈jQuery中的工具方法全部内容,希望文章能够帮你解决浅谈jQuery中的工具方法所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。