页面元素隐藏与显示

页面元素隐藏与显示

关于页面元素的隐藏在pc上展示的页面上,我在这里提供三种方法:

jquery 的toggle()方法

toggle的语法:

 $(selector).toggle(function1(),function2(),functionN(),...)

要实现显示隐藏的话,就直接$(selector).toggle();
如果你选择的元素是显示的就会隐藏的,你选择的元素是隐藏的就会显示的;

jquery的hide()方法和show()方法;

语法:

 $(selector).hide(speed,callback)
 $(selector).show(speed,callback) 

参数可以不填,speed表示你执行该操作想多久,callback:是一个回调函数,表示隐藏(显示)完成后.你还想干什么;
注意:输入callback参数就一定要speed参数;

jquery控制css

隐藏语法:

$(selector).css("display","none");

显示语法:

$(selector).css("display","list-item");
$(selector).css("display","inline");
...

注:

所有主流浏览器都支持 display 属性。Internet Explorer 8 （以及更高版本）支持属性值 “inline-table”、”run-in”、”table”、”table-caption”、”table-cell”、”table-column”、”table-column-group”、”table-row”、”table-row-group”、以及 “inherit”。

关于这些方法在pc(电脑)和移动端(手机)使用区别

前面两个不支持H5新特性(我遇到过这个问题)….页面在手机上显示不起作用,如果在做手机上的页面的话,建议用css来控制;

这三个都能在pc上起作用;