本文详细介绍了HTML `一 <label>标签及for属性
Label对象
表示一个HTML<keygen>元素
访问Label对象
使用getElementById()来访问<label>元素
var x=document.getElementById("myLabel");
创建Label对象
var x=document.createElement("LABEL");
Label对象属性
control 描述：返回标注的控件
form 描述：返回一个包含Label的表单的引用
htmlFor 描述：设置或返回label的for属性的值
label的for属性总结
1.定义：for属性规定label与哪个表单元素绑定。
<label>是专门为<input>元素服务的，为其定义标记；
label和表单控件绑定方式有两种：
方法一：将表单控件作为label的内容，这种就是隐士绑定
此时，不需要for属性，绑定的控件也不需要id属性
隐士绑定：
<label>Date of Birth:<input type="text" name="DofB" /></label>
方法二：为label标签下的for属性命名一个目标表单的id，这种就是显示绑定。
显式绑定：
<label for="SSN">Social Security Number:</label>
<input type="text" name="SocSecNum" id="SSN" />
二、为什么要给label上面加上for属性
给 label 加了 for 属性绑定了input控件后，可以提高鼠标用户的用户体检。
如果在label 元素内点击文本，就会触发此控件，也就是说，当用户渲染该标签时，浏览器就会自动将焦点转到和标签相关的表单控件上。
Label htmlFor 属性
返回 label 的 for 属性的值：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<form>
<label id="myLabel" for="male">Male</label>
<input type="radio" name="sex" id="male" value="male"><br>
</form>
<p>点击“尝试一下”按钮返回 label 的 for 属性的值。</p>
<p id="demo"></p>
<button οnclick="myFunction()">尝试一下</button>
<script>
function myFunction(){
var x = document.getElementById("myLabel").htmlFor;
document.getElementById("demo").innerHTML=x;
}
</script>
</body>
</html>
定义和用法
htmlFor 属性设置或返回 lable 的 for 属性的值。
for 属性指定 labe
最低0.47元/天 解锁文章
1796
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
