jquery中获得jq对象(dom对象集合)的方法

jquery中获得jq对象(dom对象集合)的方法
jquery中获得jq对象(dom对象集合)的方法

jquery对象访问。

Jq对象(dom对象集合)的Eq方法和jq选择器返回的都是是jquery对象,只能使用jquery 方法;Jq对象(dom集合)的get方法和“jq对象[i]”返回的是dom元素对象,只能使用dom方法。

Jq对象的find(selector |obj|ele)和children用来查找子对象和后代对象

Jq对象的find方法用于查找当前jq对象(dom集合)的后代对象,Jq对象的children方法用于查找当前jq对象(dom集合)的子对象对象。这两个方法都只能使用jq对象(dom对象集合)来调用,并且他们返回的也是jq对象。

Jq手册中的api方法都是js对象(dom集合)对象或者$对象的方法。只能使用jq对象(dom 集合)或者$来调用。如each,attr、val,find,children等等

Jq对象的index方法搜索当前集合中的匹配的元素,并返回相应元素的索引值,从0开始计数

如果不给index方法传递参数,那么返回值就是这个jQuery对象集合中第一个元素相对于其同辈元素的位置。

如果参数是一组DOM元素或者jQuery对象,那么返回值就是传递的元素相对于原先集合的位置。

如果参数是一个选择器,那么返回值就是原先元素相对于选择器匹配元素中的位置。如果找不到匹配的元素,则返回-1。

Jq选择器

1、个基本选择器:

基本选择器可以拼接一起来选择某组元素,原则:

对同一个元素描述的多个基本选择器中间没有任何间隔。

如div[name=aa]表示name属性等于aa的div元素(元素名选择器div和属性选择器[name=aa]中间没有任何间隔)。

div.cval表示class值等于cval的div元素,表示class值等于cval是div元素(类选择器.cval 和元素名选择器div之间同样没有任何间隔)

#id值

.class值

元素名

//属性

[attr]具有aaa属性

[aaa^]//具有以aaa开头的属性

[aaa$]//具有以aaa结尾的属性

[attr=xx]

[attr!=xx]

:typeval //type值为typeval的表单域(input)。实际是省略了文本

//文本

:empty 帅选不包含子元素或者文本的元素

:contains('John') 包含指定文本元素

//状态

:hidden 隐藏元素

:visible可见元素

:checked 所有选中的被选中元素(复选框、单选框等,不包括select中的option) :selected匹配所有选中的(select的)option元素

:disabled不可用元素(input)

:enabled可用元素(input)

2、选取指定子元素

parent >child

3、匹配紧跟在后面的next元素

Prev + next

4、匹配后代元素

E1 E2

5、根据原文档中的位置(index)选择子元素

E1 E2:nth-child(index) //index从1开始

E1 E2:first-child

E1 E2:last-child

E1 E2:only-child

eg

  • John
  • Karl
  • Brandon

  • Glen
  • Tane
  • Ralph

$("ul li:first-child")

结果:

[

  • John
  • ,
  • Glen
  • ]

    6、根据前面所选择的集合中元素的位置(index)选择指定index的元素对所选集合根据index再过滤

    :eq(index) //index从0开始

    :gt(index)//索引大于指定值的元素

    :lt(index)//索引等于指定值的元素

    eg

    Header 1
    Value 1
    Value 2

    $("tr:lt(1)")

    结果:

    [ Header 1 ]

    7、需要同时满足多个条件---[]

    [selector1][selector2][selectorN]

    8、将每一个选择器匹配到的元素合并后一起返回---,

    selector1,selector2,selectorN

    js和jquery获取父级元素、子级元素、兄弟元素的方法

    原文地址:js和jquery获取父级元素、子级元素、兄弟元素的方法作者:草根gis 先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的方法作对比。 JS的方法会比JQUERY麻烦很多,主要则是因为FF浏览器,FF浏览器会把你的换行也当最DOM元素 原生的JS获取ID为test的元素下的子元素。可以用: var a = docuemnt.getElementById("test").getElementsByTagName_r("div"); 这样是没有问题的 此时a.length=2; 但是如果我们换另一种方法 var b =document.getElementByIdx_x("test").childNodes; 此时b.length 在IE浏览器中没问题,其依旧等于2,但是在FF浏览器中则会使4,是因为FF把换行也当做一个元素了。 所以,在此,我们就要做处理了,需遍历这些元素,把元素类型为空格而且是文本都删除。 functiondel_ff(elem){ varelem_child = elem.childNodes; for(vari=0; i< p=""> if(elem_child[i].nodeName == "#text" && !/s/.test(elem_child.nodeValue)) {elem.removeChild(elem_child)

    } } } 上述函数遍历子元素,当元素里面有节点类型是文本并且文本类型节点的节点值是空的。就把他删除。 nodeNames可以得到一个节点的节点类型,/s/是非空字符在JS里的正则表达式。前面加!,则表示是空字符 test() 方法用于检测一个字符串是否匹配某个模式.语法是:RegExpObject.test(string) 如果字符串string 中含有与RegExpObject 匹配的文本,则返回true,否则返回false。 nodeValue表示得到这个节点里的值。 removeChild则是删除元素的子元素。 之后,在调用子,父,兄,这些属性之前,调用上面的函数把空格清理一下就可以了 下面介绍JQUERY的父,子,兄弟节点查找方法 jQuery.parent(expr) 找父亲节点,可以传入expr进行过滤,比如$("span").parent()或者$("span").parent(".class") jQuery.parents(expr),类似于jQuery.parents(expr),但是是查找所有祖先元素,不限于父元素

    jQuery常用功能大全

    jQuery常用功能大全 1、关于页面元素的引用 通过jquery的$()引用元素包括通过id、class、元素名以及元素的层级关系及dom或者xpath条件等方法,且返回的对象为jquery 对象(集合对象),不能直接调用dom定义的方法。 2、jQuery对象与dom对象的转换 只有jquery对象才能使用jquery定义的方法。注意dom对象和jquery对象是有区别的,调用方法时要注意操作的是dom对象还是jquery对象。 普通的dom对象一般可以通过$()转换成jquery对象。 如:$(document.getElementByIdx_x("msg"))则为jquery对象,可以使用jquery的方法。 由于jquery对象本身是一个集合。所以如果jquery对象要转换为dom对象则必须取出其中的某一项,一般可通过索引取出。 如:$("#msg")[0],$("div").eq(1)[0],$("div").get()[1],$("td")[5]这些都是dom对象,可以使用dom中的方法,但不能再使用Jquery的方法。 以下几种写法都是正确的: $("#msg").html(); $("#msg")[0].innerHTML; $("#msg").eq(0)[0].innerHTML; $("#msg").get(0).innerHTML; 3、如何获取jQuery集合的某一项 对于获取的元素集合,获取其中的某一项(通过索引指定)可以使用eq或get(n)方法或者索引号获取,要注意,eq返回的是jquery 对象,而get(n)和索引返回的是dom元素对象。对于jquery对象只能使用jquery的方法,而dom对象只能使用dom的方法,如要获取第三个

    元素的内容。有如下两种方法: $("div").eq(2).html(); //调用jquery对象的方法$("div").get(2).innerHTML; //调用dom的方法属性

    jquery学习总结(超级详细)

    window.onload $(document).ready() 执 行时机必须等待网页中所有的内容加载完毕后(包括 图片)才能执行 网页中所有DOM结构绘制完毕后就 执行,可能DOM元素关联的东西并 没有加载完 编写个数不能同时编写多个,以下代码无法正确执行: window.onload =function({alert("test1");}window.onload = function(){alert("test2");}结果只会输出 "test2" 能同时编写多个 简 化写法无 $(document).ready(function(){}); 可以简写成$(function(){}); 一、选择网页元素 jQuery的基本设计和主要用法,就是"选择某个网页元素,然后对其进行某种操作"。这是它区别于其他函数库的根本特点。 使用jQuery的第一步,往往就是将一个选择表达式,放进构造函数jQuery()(简写为$),然后得到被选中的元素。 选择表达式可以是CSS选择器: $(document)//选择整个文档对象 $('#myId')//选择ID为myId的网页元素 $('div.myClass')//选择class为myClass的div元素 $('input[name=first]')//选择name属性等于first的input元素 也可以是jQuery特有的表达式: $('a:first')//选择网页中第一个a元素 $('tr:odd')//选择表格的奇数行 $('#myForm :input')//选择表单中的input元素 $('div:visible') //选择可见的div元素 $('div:gt(2)')//选择所有的div元素,除了前三个 $('div:animated')//选择当前处于动画状态的div元素

    jquery

    jQuery 教程