利用js改变css里面的display

html-css012

利用js改变css里面的display,第1张

$("#div").css("display","none")//修改display属性为none

$("#div").css("display","block")//修改display属性为block

jquery的css()方法的用法:

1.只需要修改一个css时格式为

$(selector).css(name,value)

2.设置多个属性的格式为

$(selector).css({property:value, property:value, ...})

可以使用jQuery的css方法,css()需要传两个参数,第一个是css元素的名称,第二个为值,例如css("display",'none')

工具原料:编辑器、浏览器

1、使用css()方法来设置某一个元素的display属性,代码如下:

body>

<div id="div1">

test

</div>

<script>

$(function(){

$("#div1").css("display",'none')

})

</script>

</body>

2、以上代码中使用$("#div1")选择器选择到div元素,然后使用css方法来设置其display值为none将元素隐藏。

3、运行的代码如下:

没有运行js代码之前:

运行的之后:

只需设置

display:none

即可将该元素设为隐藏的。默认的是显示的,即不设置display即默认显示。

isplay 属性规定元素应该生成的框的类型,定义建立布局时元素生成的显示框类型。

display的值可以取如下的值:

none此元素不会被显示。

block此元素将显示为块级元素,此元素前后会带有换行符。

inline默认。此元素会被显示为内联元素,元素前后没有换行符。

inline-block行内块元素。(CSS2.1 新增的值)