jquery之对象访问

原创 2016年01月05日 10:37:49

                   jquery之对象访问

一、    $.each()与each()方法的作用及区别

$.each()和each()都是用来遍历对象集合和数组的,不同的是each()方法多用来遍历DOM节点,执行DOM操作。而$.each()多用于对象和数组的操作。

1)      each()方法

each()方法传递一个匿名函数,匿名函数同时传递俩个参数,第一个返回被遍历对象集合的下标,如果是DOM对象集合则第二个返回当前循环下的DOM对象。

<ul>

       <li>1</li>

       <li>2</li>

       <li>3</li>

</ul>

<script>

       $("ul li").each(function(i,data){

              alert(i);

              alert(data)

       });

</script>

有3个li标签,所以执行3次循环,i依次是0、1、2,data返回当前li的DOM对象。

var arr = ["a","b","c"];

$(arr).each(function(i,data){

       alert(i);

       alert(data)

});

如果是一个数组,则i依次返回0、1、2,data依次返回a、b、c。

2)      $.each()方法

该方法主要用于遍历对象和数组。

第一个参数是被遍历的对象,第二个参数是匿名函数格式与each()相同

var arr = ["a","b","c"];

$.each(arr,function(i,data){

       alert(i);

       alert(data)

});

如果是一个数组,则i依次返回0、1、2,data依次返回a、b、c。

var arr = {

       name:"jack",

       age:"24",

       show:function (){

              alert(this.name);

       }

};

$.each(arr,function(i,data){

       alert(i);

       alert(data)

});

如果是一个对象,则i放回方法名依次是name,age,show,data返回jack、24、function(){alert(this.name); }。

如果用each()是不可以遍历上述这个对象的。

$.each()each()方法可以在匿名函数内返回true或者falsetrue等同于for循环的continue,false等同于break

二、    size()和length

匹配当前元素的个数。

二者功能等价。

<ul>

       <li>1</li>

       <li>2</li>

       <li>3</li>

</ul>

$(“ul li”).length;  返回3

$(“ul li”).size();    返回3

三、    selector与context

1).selector属性

返回传给jquery的原始选择器,意思就是返回你用什么选择器来找这个元素的。

<ul>

       <li>1</li>

       <li>2</li>

       <li>3</li>

</ul>

$(“ul li:gt(0)”).css(“color”,”red”);      

$(“ul li:gt(0)”).selector;  返回string类型的ul li:gt(0)

2).context属性

返回传给jquery的原始DOM节点内容,也就是$()的第二个参数,没有默认是[object HTMLDocument];

alert($("li",document.querySelector("ul")).context);返回ul的DOM对象。

四、    get()方法和index()方法

1).get()方法

get(index)传递一个数字以0开始,返回当前对象的DOM节点对象,功能就是实现jquery对象向DOM对象的转换。

类似的有eq()方法,用法一样,功能选取当前对象集合的第几个对象,返回的是jquery对象。

2).index()方法

搜索匹配的元素,并返回当前元素的索引值,以0开始。找不到则返回-1。

<ul>

       <li>1</li>

       <li>2</li>

       <li>3</li>

</ul>

$('li').index(document.getElementById('bar'));//1,传递一个DOM对象,返回这个对象在原先集合中的索引位置

$('li').index($('#bar')); //1,传递一个jQuery对象

$('li').index($('li:gt(0)')); //1,传递一组jQuery对象,返回这个对象中第一个元素在原先集合中的索引位置

$('#bar').index('li'); //1,传递一个选择器,返回#bar在所有li中的索引位置

$('#bar').index(); //1,不传递参数,返回这个元素在同辈中的索引位置。

版权声明:欢迎大家一起交流

jQuery源码学习之对象创建与初始化

读了几次jquery创建对象的部分的源码都没读懂,今天终于想通了,持续兴奋中。。。 (一)、首先说明下jquery的对象创建方式: jQuery = function( selecto...
  • iFairyshi
  • iFairyshi
  • 2016年04月23日 22:44
  • 1320

用#id取得的jQuery对象与document.getElementByIdid所得到的DOM对象区别

转载于: 贤心博客 用#id作为选择符取得的是jQuery对象而并非是document.getElementById(’id’)所得到的DOM对象,两者并不等价。 var $cr=$('#...
  • a1943206465
  • a1943206465
  • 2017年02月06日 15:02
  • 2480

jQuery文档对象的操作

1、创建属性:在DOM规范中,属性节点比较特殊,用户无法通过node对象提供的方法遍历或者定位属性节点,必须使用element对象定义的特定方法来创建和访问属性节点。jQuery创建属性节点和创建文本...
  • magic232
  • magic232
  • 2013年04月24日 15:30
  • 608

dom对象和jquery对象的区别

在开发前台页面的时候,如果要想把页面做的交互性高一些,需要写大量的js代码和css样式.        在js中,获取对象,可以通过 document.getElementById 或 docum...
  • zc474235918
  • zc474235918
  • 2015年12月20日 08:14
  • 1317

jQuery源码学习之四 (jQUery对象的实例属性和方法)

jQUery源码: jQuery.fn = jQuery.prototype = { // The current version of jQuery being used jquery: co...
  • hdchangchang
  • hdchangchang
  • 2014年07月23日 11:19
  • 2696

Jquery 获取对象的几种方式

1、JQuery的核心的一些方法 each(callback) ‘就像循环$("Element").length; ‘元素的个数,是个属性 $("Element").size(); ’也是元素的个数...
  • zengyonglan
  • zengyonglan
  • 2017年01月03日 16:01
  • 3172

jQuery对象与DOM对象的区别

jQuery对象与DOM对象 1:对于才开始接触jQuery库的初学者,我们需要清楚认识一点: jQuery对象与DOM对象是不一样的 2:可能一时半会分不清楚哪些是jQuery对象,哪些是...
  • qq_18832439
  • qq_18832439
  • 2016年04月23日 20:18
  • 666

JQuery基础知识----jQuery 对象,选择器

1.jQuery 对象和 DOM 对象     •jQuery对象就是通过jQuery($())包装DOM对象后产生的对象     •jQuery对象是 jQuery独有的. 如果一个对象是 jQu...
  • oChangWen
  • oChangWen
  • 2016年10月05日 23:54
  • 1286

Jquery 获取对象的几种方式

1、先讲讲JQuery的概念 JQuery首先是由一个 America 的叫什么 John Resig的人创建的,后来又很多的JS高手也加入了这个团队。其实 JQuery是一个JavaScrip...
  • fangqun663775
  • fangqun663775
  • 2014年03月17日 16:50
  • 2154

javascript jquery 判断对象为空的方式

java中存在很多空指针的问题,需要经常做预防和判断,如若不然
  • xinfei0803
  • xinfei0803
  • 2014年11月02日 12:48
  • 1748
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:jquery之对象访问
举报原因:
原因补充:

(最多只允许输入30个字)