如何在 HTML 中指定某个元素尚不相关？

布尔属性构成了hidden 属性。

它表示当存在时，元素要么尚不重要，要么不再相关。指定了 hidden 属性的元素不应由浏览器显示。hidden 属性的另一个应用是阻止用户查看元素，直到满足不同的要求。

语法

<p hidden> ……… </p>

以下是示例……

示例

我们使用 hidden 属性隐藏 html 脚本中不相关的元素。

<!DOCTYPE html>
<html>
<body>
   <h2>Heading</h2>
   <p>This is a demo paragraph and visible.</p>
   <p hidden>This is a demo paragraph and hidden.</p>
</body>
</html>

输出

执行上述脚本后获得的输出为 -

示例

在以下示例中，我们使用 hidden 属性来指定元素不相关。

<!DOCTYPE html>
<html>
<body>
   <p hidden>A laptop, laptop computer, or notebook computer is a small, portable personal computer with a screen and alphanumeric keyboard.</p>
   <p>A laptop is a personal computer that can be easily moved and used in a variety of locations.</p>
</body>
</html>

输出

执行上述脚本后，隐藏内容中的文本将显示，其余文本也将显示。

示例：隐藏表单中的内容

可以使用 hidden 属性隐藏表单中的不相关信息。但是，语法略有不同 -

语法

<input type = “hidden”>

让我们看一个创建的求职申请表单，其中有三个输入空间：输入姓名、招聘经理提出的问题和薪资条款。但是，薪资条款被隐藏，因为它与求职申请表单无关。

<form>
   <div>
      <label for="title">Enter Name:</label>
      <input type="text" id="title" name="title" value="My Name">
   </div>
   <div>
      <label for="content">Why should we hire you? Write in 300 words:</label>
      <textarea id="content" name="content" cols="60" rows="5">
         Some Content Here.
      </textarea>
   </div>
   <div>
      <label for="text"> Salary (Is hidden):</label>
      <input type="hidden" id="text" name="text" value="Hidden Content">
   </div>
   <div>
      <button type="submit">Update post</button>
   </div>
   <input type="hidden" id="postId" name="postId" value="34657">
</form>

输出

执行上述脚本后获得的输出为：

更新于： 2022-09-05

139 次查看

启动你的 职业生涯

完成课程获得认证

开始学习
广告

© . All rights reserved.