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,不传递参数,返回这个元素在同辈中的索引位置。

版权声明:欢迎大家一起交流 https://blog.csdn.net/hf549072646/article/details/50460744

jQuery对象访问

jQuery对象访问 1.      each(callback) 以每一个匹配的元素作为上下文来执行一个函数。 实例:迭代两个图像,并设置它们的 src 属性。注意:此处 this 指代的是 ...
  • weiwei07241126
  • weiwei07241126
  • 2012-03-05 13:27:36
  • 2192

jquery对象访问 介绍及如何使用

前言本篇是继上篇jQuery核心函数之后介绍如何访问jQuery对象。jquery对象访问each(callback)size()lengthselectorcontextget()get(index...
  • u010989191
  • u010989191
  • 2016-05-01 23:05:11
  • 6951

Jquery对象常用方法

Jquery对象常用的方法:$(”p”).addClass(css中定义的样式类型); 给某个元素添加样式 $(”img”).attr({src:”test.jpg”,alt:”test Image”...
  • u011225629
  • u011225629
  • 2016-03-18 10:58:40
  • 5548

jQuery对象实现的原理

$()每调用一次,就需要实例化一个(有着很多封装方法)的类数组对象,然后返回, jQuery对象实现原理 模拟原理源码: (我命名为factory)function factory(value) {...
  • wangcuiling_123
  • wangcuiling_123
  • 2017-07-22 01:45:00
  • 662

Jquery学习4-1---jquery用法之访问jquery对象

首先,我们必须要了解jquery定义的基本方法和属性,特别是jquery对象的方法和属性。   上面记得,jquery对象是javascript数据集合,要访问里面的元素,可以使用索引值,也可以使...
  • lishiyuzuji
  • lishiyuzuji
  • 2012-02-02 11:10:15
  • 2023

jquery之对象访问

jquery之对象访问 一、    $.each()与each()方法的作用及区别 $.each()和each()都是用来遍历对象集合和数组的,不同的是each()方法多用来遍历D...
  • hf549072646
  • hf549072646
  • 2016-01-05 10:37:49
  • 138

jQuery对象包含的方法和工具方法

jQuery对象包含的一些方法: .read(); 事件, 明一个函数,当DOM完全加载完之后运行该函数 .click(); 事件, 为匹配元素设置click事件处理程序 .ajax...
  • liuwenliang_002
  • liuwenliang_002
  • 2017-12-22 16:25:28
  • 84

jQuery的引入与应用

1.jQuery:实质上是一个js类库,对常用的方法和对象进行封装,以方便调用。 2.jQuer调用:在javascript标签中,将src属性改为对应的jQuery源文件路径即可。 3....
  • weixin_38132536
  • weixin_38132536
  • 2017-09-05 23:07:44
  • 278

JS对象与jQuery对象

JS对象大致可以分为三种,如下图:JS常用内置对象(JS自身所持有的对象,不需要创建,直接可用):String:API跟java的字符串API大致相同两种创建对象的方式:String s1 = &qu...
  • huang_yx
  • huang_yx
  • 2018-03-25 11:29:17
  • 71
收藏助手
不良信息举报
您举报文章:jquery之对象访问
举报原因:
原因补充:

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