js style.display = "" 和style.display="none" 区别

如题所述

1、实际作用不同。

js style.display是清除屏幕显示样式,使用默认值。style.display="none" ,none是指代某一个代码,将这个代码进行隐藏,并没有删除操作。

2、用法不同。

js style.display使网页代码上显示的内容彻底删除消失,不为保留任何隐藏空间。style.display="none" 是会为其保留隐藏空间,等待其他代码读取写入。

扩展资料:

网页中某个代码中的元素有{display: none;}的样式的话,标签上相对应的的图片会被该none请求加载,但是不会被none进行渲染。代码中的隐藏信息也会被代码中的元素进行读取,并占有一定的隐藏空间。

如果上一级元素有{display: none;}的样式的话,那么下一级元素在样式表中的背景图片既不会渲染也不会加载,但是标签上的图片会被加载不会被渲染。

参考资料:W3School-HTML DOM display 属性

温馨提示:答案为网友推荐,仅供参考
第1个回答  2019-07-05

一、意思不同

style.display = "";是清除display样式,display将使用默认值(块元素会变成block,内联元素会变成inline)。

style.display="none"; 中“none”是一个值,表示元素将隐藏。

二、用法

style="display:none": 使对象在网页上彻底消失,不为被隐藏的对象保留物理空间.

例子:

<html>

<head>

<title>style="visibility:hidden"与style="display:none"的区别</title>

</head>

<body>

<span style="visibility:hidden; background-color:Blue">隐藏区域</span><span style="background-color:Green">显示区域</span>

<span style="display:none; background-color:Blue">隐藏区域</span><span style="background-color:Green">显示区域</span><br/>

</body>

</html>

三、效果不同

如果元素有{display: none;}的样式的话,标签上的图片会被请求加载,但是不会被渲染,如果父元素有{display: none;}的样式的话,子元素在样式表中的背景图片既不会渲染也不会加载,但是标签上的图片会被加载不会被渲染。

本回答被网友采纳
第2个回答  2019-08-04

style.display = "";是清除display样式,display将使用默认值(块元素会变成block,内联元素会变成inline)style.display="none"; 中“none”是一个值,表示元素将隐藏。


扩展资料:

style.display其他值的意义:none 此元素不会被显示。block 此元素将显示为块级元素,此元素前后会带有换行符。inline 默认。此元素会被显示为内联元素,元素前后没有换行符。

list-item 此元素会作为列表显示。run-in 此元素会根据上下文作为块级元素或内联元素显示。compact    此元素会根据上下文作为块级元素或内联元素显示。

table    此元素会作为块级表格来显示(类似 <table>),表格前后带有换行符。inline-table 此元素会作为内联表格来显示(类似 <table>),表格前后没有换行符。

table-row-group 此元素会作为一个或多个行的分组来显示(类似 <tbody>)。table-header-group    此元素会作为一个或多个行的分组来显示(类似 <thead>)。

table-footer-group    此元素会作为一个或多个行的分组来显示(类似 <tfoot>)。table-row 此元素会作为一个表格行显示(类似 <tr>)。 

table-column-group    此元素会作为一个或多个列的分组来显示(类似 <colgroup>)。 table-column    此元素会作为一个单元格列显示(类似 <col>)。

table-cell    此元素会作为一个表格单元格显示(类似 <td> 和 <th>)。table-caption    此元素会作为一个表格标题显示(类似 <caption>)。

参考资料来源:

本回答被网友采纳
第3个回答  2019-12-23

一、作用不同

1、js style.display = "":是清除display样式,display将使用默认值,块元素会变成block,内联元素会变成inline。

2、style.display="none":“none”是一个值,表示元素将隐藏。

二、使用场景不同

1、js style.display = "":元素大多是"内联"或"块"元素:一个内联元素,在其左侧和右侧都是浮动内容。一个块元素填满整个行。

2、style.display="none":允许作者显示或隐藏一个元素。与 visibility 属性类似。然而,如果您设置 display:none,将隐藏整个元素。


三、语法不同

1、js style.display = "":Object.style.display="value"元素呈现为块级元素或内联元素,取决于上下文。

2、style.display="none":document.getElementById("p1").style.display="none";元素呈现为内联表格(类似 <table>),表格前后没有。    


参考资料来源:

参考资料来源:

本回答被网友采纳
第4个回答  推荐于2017-10-03
style.display = "";是清除display样式,display将使用默认值(块元素会变成block,内联元素会变成inline)
style.display="none"; 中“none”是一个值,表示元素将隐藏本回答被提问者采纳

相关了解……

你可能感兴趣的内容

本站内容来自于网友发表,不代表本站立场,仅表示其个人看法,不对其真实性、正确性、有效性作任何的担保
相关事宜请发邮件给我们
© 非常风气网