提出问题:只已知父元素和父元素中子元素的次序,怎么通过jQuery方法获得该元素?

     <p>第一部分:</p>
<ul>
<li>1</li>
<li>2</li> // 选择这个子元素
<li>3</li>
</ul>
<p>第二部分:</p>
<ul>
<li>4</li>
<li>5</li>
<li>6</li>
</ul>

在不通过选择器的情况下(:first,:last,:nth-child()等),如何通过父元素来选择特定次序的子元素呢?

方法一:eq(n)

$("ul").children().eq(1).css("backgroundColor","blue");

或者$("ul").children().eq(-5).css("backgroundColor","blue");

方法二:get(n)--注意得到的DOM对象还是jQuery对象

直接用get()方法得到是DOM对象:

$("ul").children().get(1).style.backgroundColor = "yellow";

或者$("ul").children()[1].style.backgroundColor = "yellow";

将get()得到的DOM对象转化为jQuery对象:

$($("ul").children().get(1)).css("backgroundColor","yellow");

方法三:slice(m,n)

$("ul").children().slice(1,2).css("backgroundColor","green");

或者$("ul").children().slice(-5,-4).css("backgroundColor","green");

小结:以上三种方法eq(n),get(n),slice(m,n)中,m,n均可正可负,以便选取特定元素。其中slice(m,n)功能更为强大,可选取一定范围内的元素。

选取最后3个:

$("ul").children().slice(3,6).css("backgroundColor","green");

或者$("ul").children().slice(-3).css("backgroundColor","green");

最后一点补充:若选取第一个或者最后一个子元素可用first()、last()方法。

jQuery中获取特定顺序子元素(子元素种类不定)的方法的更多相关文章

  1. Jquery中获取iframe的代码方法

    父窗口中操作iframe:window.frames["iframeChild"].document //假如iframe的id为iframeChild 在子窗口中操作父窗口:wi ...

  2. jquery中获取当前点击对象

    jquery中获取当前点击对象的简单方法就是,在点击事件click中传入event对象 click(function(event)); 调用当前对象就是$(event.target);

  3. jQuery中获取a标签的值

    如题,一组相同action的a标签,不同的是a标签的内容为搜索内容.点击页面显示不同的数据 刚开始试过在 a标签中添加 value值 和id 的值,结果在jQuery中获取值均失败! 后来发现,根本不 ...

  4. jquery中获取iframe的id的方法:

    jquery中获取iframe的id的方法: var frameId = window.frameElement && window.frameElement.id || ''; al ...

  5. jquery中判断选择器,找没找到元素用$().size()==0

    jquery中判断选择器,找没找到元素用$().size()==0

  6. jquery中获取元素的几种方式小结

    1 从集合中通过指定的序号获取元素 html: 复制代码代码如下: <div> <p>0</p> <p>1</p> <p>2&l ...

  7. JQuery中根据属性或属性值获得元素(6种情况获取方法)

    根据属性获得元素 1.比如要获取页面p标签中属性有id的元素 $("p[id]").css("color","red"); 根据属性值获得元 ...

  8. JQuery中根据属性或属性值获得元素

    根据属性获得元素 1.比如要获取页面p标签中属性有id的元素 $("p[id]").css("color","red"); 根据属性值获得元 ...

  9. js和jquery中获取非行间样式

    样式又分为了行间样式和非行间样式.一般来说行间样式用的是比较少的,因为它能够作用的范围就只有一个元素,而非行间样式的作用范围可以是一类元素(即拥有相同德标签,或者说是有相同的类名,(当然id名不可能相 ...

随机推荐

  1. C++设计模式之代理模式

        IPhone 6已经在中国香港开售了,圆了在专卖店等候一个多月苹果粉丝的苹果梦.然而对中国大陆而言.须要到9月17日苹果才在大陆开售.这对中国大陆的粉丝而言,不亚于一种煎熬,因此而滋生一种代购 ...

  2. 20180113Go匿名函数和闭包

    最近codereview看到闭包,得学习下 https://studygolang.com/articles/5057 匿名函数:没有函数名的函数 闭包:外部函数定义的内部函数. 闭包给访问外部函数定 ...

  3. javascript中window与document对象、setInterval与setTimeout定时器的用法与区别

    一.写在前面 本人前端菜鸟一枚,学习前端不久,学习过程中有很多概念.定义在使用时容易混淆,在此给向我一样刚踏入前端之门的童鞋们归纳一下.今天给大家分享一下js中window与document对象.se ...

  4. centos配置IP地址

    1. vi /etc/sysconfig/network-scripts/ifcfg-eth0 2. DEVICE=eth1HWADDR=00:0C:29:D2:9A:F5TYPE=EthernetU ...

  5. PCB焊接工艺

    1. 有铅焊接工艺    240~260℃. 2. BGA焊盘直径为球径80%.

  6. windows下mysql表名不自动转换小写配置

    mysql5.6版本配置文件有两个 1.默认的配置在program files/MySQL/MySQL Server 5.6/my-default.ini 2.一个在programData/MySQL ...

  7. Oracle----Oracle 11g XE release2安装与指导

    今天上午我安装了Oracle 11g企业版,发现太占内存了,考虑到MS SQL有express版本,所以寻思着尝试尝试Oracle 11g的express版本,就是EX版本.下面是具体的安装步骤. 1 ...

  8. ThinkPHP自动填充实现无限级分类的方法

    这篇文章主要介绍了ThinkPHP自动填充实现无限级分类的方法,是ThinkPHP项目开发中非常实用的一个技巧,需要的朋友可以参考下   本文实例展示了ThinkPHP自动填充实现无限级分类的方法,是 ...

  9. github+hexo+node.js搭建个人博客基本过程及遇到的问题

    一,所需工具 1,github账号+Gitclient+配置SSH key 2,安装node.js. 3,安装Hexo. 当中,github pages是我们用来部署我们本地的博客到github上的. ...

  10. 【独立开发人员er Cocos2d-x实战 013】Cocos2dx 网络编程实战之星座运势

    学习cocos2d-x和cocos creator的圈子:cocos2d-x:436689827    cocos creator:124727696 本篇文章主要内容:jsoncpp的使用,Coco ...