HTML DOM Input Password placeholder 属性
htmlweb developmentfront end technology更新于 2025/10/13 15:40:17
HTML DOM Input Password placeholder 属性用于设置或返回输入密码字段的占位符属性值。占位符属性用于在用户输入任何内容之前，在输入字段内显示一段文本，向网页用户提示输入元素。占位符文本默认为灰色，并且与值属性不同，不会提交到表单。
语法
以下是语法 −
设置 placeholder 属性 −
passwordObject.placeholder = text
此处，text 表示占位符文本，用于向用户指定有关密码字段的提示。
示例
让我们来看一个输入密码占位符属性的示例 −
<!DOCTYPE html>
<html>
<body>
<h1>password placeholder property</h1>
Password: <input type="password" id="PASS1" placeholder="....">
<p>Change the placeholder text of the above field by clicking the below button</p>
<button onclick="changeHolder()">CHANGE</button>
<script>
function changeHolder() {
document.getElementById("PASS1").placeholder = "Enter your password here..";
}
</script>
</body>
</html>
输出
这将产生以下输出 −
点击"更改"按钮 −
在上面的例子中 −
我们首先创建了一个输入密码字段，其 ID 为 “PASS1”，并将 placeholder 属性值设置为 “….”。
Password:<input type="password" id="PASS1" placeholder="....">
然后我们创建了一个按钮 CHANGE，当用户点击时，它会执行 changeHolder() 方法 −
<button onclick="changeHolder()">CHANGE</button>
changeHolder() 使用 getElementById() 方法获取类型为 password 的输入元素。然后，它将其占位符属性值设置为"在此处输入您的密码……"，这将反映在密码字段中。 −
function changeHolder() {
document.getElementById("PASS1").placeholder = "Enter your password here..";
}
相关文章
有用资源
html 参考教程 - 该教程包含有关 html 的更多信息:https://www.cainiaomax.com/html/
