jQuery怎么选择自身元素andSelf()方法使用

来源:互联网 发布:鹏业软件格式 编辑:程序博客网 时间:2024/05/21 08:37

当我们用jQuery选择器的时候,有时需要选择自身元素,这时一个很有用的函数会帮大忙,解决关键问题。

这个方法就是 jQuery 中的 andSelf() 方法。

下面举个简单的小例子~

这个例子网页打开一秒钟后改变自身和子元素的背景色~

<html><head> <title>jQuery选择器选中自身元素-易云互联</title></head><div id="_self" style="    width: 200px;    height: 300px;    background-color: red;    margin: 0 auto;    /* display: block; */    position: relative;    /* float: left; */    overflow: hidden;">   <div id="_son" style="    width: 100px;    height: 200px;    background-color: gray;    /* margin: 0 auto; */    /* display: block; */    /* vertical-align: middle; */    /* padding-top: 50px; */    position: relative;    /* float: left; */    margin: 0 auto;    margin-top: 50px;line-height:200px;font-family:微软雅黑;">这个是子元素   </div></div><script type="text/javascript" src="http://www.eyun.me/templets/eyun/js/jquery.min.js"></script><script type="text/javascript">jQuery(function(){    setTimeout(function(){ jQuery("#_self").find("#_son").css("background-color","yellow").end().andSelf().css("background-color","cyan");},1000);});</script></body></html>

点击在线预览

在写这个小例子时,又注意到一个问题:当子元素在用margin-top css 属性时,父元素同时也会下落, margin-top造成父元素下沉

解决这个问题的方法就是在父元素中加入 overflow:hidden; 这个css 属性就可以解决

0 0