找外贸工作哪个网站好,网站后台服务,嘉兴网站优化联系方式,临海市城乡建设规划局网站首先先介绍visibility这个CSS属性。 visibility用于表示该元素是否显示#xff0c;其取值有#xff1a; visible#xff1a;设置对象可视。　　hidden#xff1a;设置对象隐藏。　　collapse#xff1a;主要用来隐藏表格的行或列#xff0c;隐藏的行或列能够被其他内容是…　　首先先介绍visibility这个CSS属性。 　　visibility用于表示该元素是否显示其取值有 　　visible设置对象可视。　　hidden设置对象隐藏。　　collapse主要用来隐藏表格的行或列隐藏的行或列能够被其他内容是用。　　这里需要说明的是collapse在IE6及更早的浏览器不支持它的作用只在表格中生效对于其他的对象等同于display:hidden。 　　介绍到这里也许我们会有个疑问那就是visibility:hidden与display:none有什么区别呢他们的不同之处就是隐藏的对象是否占据位置。visibility:hidden在对象隐藏之后它所占据的地方并不被其他元素占据。就好比一个人穿着隐身衣一样虽然我们看不见他但是他实际还在那里我们仍然能摸到他他所站的位置也不能放别的东西。但是display:none就真的消失了这个人就真的不存在了。因此如果我们需要将一个容器隐藏但是又不想让它后面的内容占据他的位置那么visibility:hidden就派上用场了。其实关于visibility:hidden与display:none的区别在于前者在浏览器解析完DOM树之后将这个容器放入渲染树进行计算和显示。而后者在生成DOM树不会放到渲染树中进行计算和绘图 　　那么现在就有一个问题就是如果一个元素是通过visibility:hidden隐藏了那么我们如何通过jquery的选择器选择到它呢我们显而易见的会想到visible。这个语法是选择到可见的元素再通过取反就可以了因此下面的代码可能是你想到的最简单的例子 script typetext/javascript $(function(){alert($(div:not(:visible)).length); }); /script body div ida stylewidth:100px; height:100px; visibility:hidden;11/div /body 但是实际上alert的结果是0也就是说查找不可见的div没有找到。为什么会是这样呢其实原因是jQuery判断visible的逻辑和我们想象中的逻辑不同我们认为这个不可见是眼睛看不到的。而jQuery的逻辑不是这样的jquery的判断逻辑是这个对象的offsetWidth和offsetHeight都为0才是不可见。而visibility:hidden的对象元素这两个值都是不为0的。从这看来选择器这样写是无法选择到这个div的。其实这个理解起来也不难虽然里面的内容看不到了但是它还在这里啊还占据着位置啊所以必然不是不可见的 　　在jQuery的早些版本1.3之前上述代码是可以选择到这个div的因为那个时候visible的逻辑和我们想的一样即除了display:none和visibility:hidden之外其他都为true。它之所以做了这个修改很大的原因是效率问题。我们可以在官方的doc上找到原文 In jQuery 1.3.1 (and older) an element was visible if its CSS display was not none, its CSS visibility was not hidden, and its type (if it was an input) was not hidden.In jQuery 1.3.2 an element is visible if its browser-reported offsetWidth or offsetHeight is greater than 0.详情可以参考全文http://docs.jquery.com/Release:jQuery_1.3.2#:visible.2F:hidden_Overhauled 　　根据上面的原理我们其实可以做一个小小的修改如果我们把div的样式改成width:0; height:0;去掉visibility:hidden我们刷新下看看alert弹出了1也就是说它仍然能找到这个div与display:none与visibility:hidden无关了而且div中的“11”还显示在页面上呢但是jquery认为它是不可见的。 　　说了这么多那么解决办法呢既然visible的判断的逻辑已经和我们想象的有偏差那么我们可以通过重新将老版本的jquery逻辑添加进来。方法有很多我这里给出一个用filter方法实现的代码 $(div).filter(function(){return ($(this).css(visibility) hidden || $(this).css(display) none); }); 上面的代码就可以实现visibility:hidden的选择了。当然如果我们常用这个方法的话可以把它封装一下。      转载于:https://www.cnblogs.com/echoloyuk/archive/2013/03/20/2971440.html