input[type=hidden]和visibility="hidden"之间的区别

Question

和visibility: hidden;有什么区别？

- meee meeee

---

一个是输入元素，另一个是样式。 - j08691

我认为他真正想问的是<input type="hidden">和<input type="text" style="visibility: hidden">之间的区别。 - Barmar

Answer 1

第一个是用于输入的元素，第二个则用于CSS2中的样式。

visibility: hidden; 可见性属性指定一个元素是否可见。

input[type=hidden] :- HIDDEN是INPUT元素在FORM表单中的一种类型属性值。它表示一个表单字段不会在文档中可见，用户也不能与之交互。可以用它来传输客户端或服务器的状态信息。

- Rahul Tripathi

Answer 2

我假设您的意思是和使用CSS有什么区别。

.hidden {
    display: none;
}

如果是这种情况，第一个是DOM类型但仍在结构中，第二个是样式方法，用于从DOM结构中删除该项。

- Phillip Berger

---

"display: none"并不会从DOM中移除元素，它只是使元素不会被渲染出来。 - Barmar

display:none 不同于 visibility: hidden，参见：visibility:hidden 和 display:none 有何区别？ - Luke

Answer 3

input[type=hidden]

这是一个 DOM 选择器（jQuery、CSS 等），用于选择任何 input 元素，其中 type 属性为 "hidden"。它与实际显示或隐藏这些元素无关，除了浏览器不渲染 <input type="hidden" /> 元素之外。

visibility="hidden"

这里是将CSS visibility 属性设置为“hidden”的操作，这会告诉浏览器不要渲染应用该属性的任何元素。这完全关乎HTML元素的显示，与另一个例子中的选择器或表单元素无关。

- David

---

“CSS可见性属性”，真的吗？ - Christophe

@Christophe: “属性”？显然是以某种方式使用JavaScript进行设置，可能不正确。但它仍然是CSS属性。 - David

Answer 4

input[type=hidden] 是一种选择器，可以匹配所有 input 元素，并且这些元素的 type 属性设置为 hidden。

我不知道 visibility="hidden" 是什么意思。它可能是 CSS 属性，但不正确。正确的写法应该是 visibility: hidden;。

- MarcinJuraszek

---

@Omega 很有趣。有关于那种用法的来源链接吗？ - MarcinJuraszek

嗯，这正是我写过的：它必须是visibility: hidden才能成为有效的CSS。他的文本使用了"和=，并不是正确的CSS。 - MarcinJuraszek