jquery的同级元素,jquery所有元素的同辈元素-成都创新互联网站建设

关于创新互联

多方位宣传企业产品与服务 突出企业形象

公司简介 公司的服务 荣誉资质 新闻动态 联系我们

jquery的同级元素,jquery所有元素的同辈元素

jquery中怎么获取父级元素和同级元素

jquery中parent()可以获取父级元素,所以获得某元素父级的父级可以使用

创新互联建站长期为数千家客户提供的网站建设服务,团队从业经验10年,关注不同地域、不同群体,并针对不同对象提供差异化的产品和服务;打造开放共赢平台,与合作伙伴共同营造健康的互联网生态环境。为灵石企业提供专业的成都网站建设、成都网站设计,灵石网站改版等技术服务。拥有十载丰富建站经验和众多成功案例,为您定制开发。

$(selector).parent().parent();

示例如下

创建Html代码及css样式

div class="class1"

class1

div class="class2"

class2

div class="class3"

class3

/div

/div

/div

div{padding:10px 20px;border:4px solid #ebcbbe;}

div.class1{width:200px;height:120px;}

jquery 选择同级元素

假如要选一个高度是100像素的div

var $div = $("div").filter(function(){

return $(this).height()==100;

});

不过最好不用高度,宽度等属性来找,定义几个class 比如 h100,h200分别代表不同的高度,按class选择是比较好的解决方法。

var $div = $("div.h100");

jquery如何取同级元素的子级?

jquery中同级元素即兄弟元素用siblings()获取,子级元素用children()获取,所以可以使用如下代码取同级元素的子级:

$('selector').siblings().children();

示例代码:

html xmlns=""

head

titleTEST/title

meta http-equiv="Content-Type" content="text/html; charset=utf-8" /

script src=""/script

style

div{padding:10px;margin:10px;}

div.xiyouji{width:250px;height:200px;border:4px solid green;}

div.sun-niu{border:4px solid red;}

div.sun-niu div{border:2px solid blue;}

/style

script

$(function(){

$("div.sun-niu").click(function() {

nephew = $(this).siblings().children().text();

if(nephew)

option = nephew;

else

option = "没有侄子";

alert(option);

});

})

/script

/head

body

div class="xiyouji"

div class="sun-niu"

孙悟空

/div

div class="sun-niu"

牛魔王

div红孩儿/div

/div

/div

/body

/html

显示效果:

点击孙悟空后,就显示了同级的子级元素,也就是他侄子红孩儿。

jquery 同级的元素怎么获取

ul lilist item 1/li lilist item 2/li li class="third-item"list item 3/li lilist item 4/li lilist item 5/li/ul $("li.third-item").siblings(); //可以获取4个li元素 $("li.third-item").prev(); //取得item2$("li.third-item").next(); //取得item4 $("li.third-item").prevAll(); //取得item1 itme2$("li.third-item").nextAll(); //取得item4 item5var $lis = $("li:last").siblings();$lis.eq(0)


分享文章:jquery的同级元素,jquery所有元素的同辈元素
网页链接:http://kswsj.cn/article/dsiispi.html

其他资讯