htmlid和name的区别是什么意思

PHP中文网

2023-03-12 帮助45人

html中的id属性

我们使用id属性可以标识唯一的HTML元素，可以在在URL中用作锚引用（带#符号的URL），或者在css中用作ID选择器来设置该元素的样式。也可以在javascript中，使用getElementById()，通过id属性值来查找元素，在对元素进行操作。例：

<p id="p1">测试文本！测试文本！</p>
<p id="p2">测试文本！测试文本！</p>

<script>
document.getElementById("p2").style.color="red";
</script>

id属性是普遍兼容的，对任何元素都有效。且id属性的值是区分大小写的，每个id值都应该是唯一的。例：

<div id="demo">
 <div id="a">div标签，id值为a</div>
 <p id="A">p标签，id值为A</p>
</div>

#a{ color: red;}
#A{ color: pink;}

效果图：

html中的name属性

name属性同样是用来标识HTML元素的，但它不具有是唯一行，它的值可以重复使用，例：单选按钮

<form action="" method="get"> 
 最喜欢水果？<br /><br /> 
 <label><input name="Fruit" type="radio" value="" />苹果 </label> <br /> 
 <label><input name="Fruit" type="radio" value="" />桃子 </label> <br /> 
 <label><input name="Fruit" type="radio" value="" />香蕉 </label> <br /> 
 <label><input name="Fruit" type="radio" value="" />梨 </label> <br /> 
 <label><input name="Fruit" type="radio" value="" />其它 </label> <br /> 
</form>

效果图：

正如上例所示，name属性经常在表单中使用，用来提交信息；它仅对a, form, iframe, img, map, input, select, textarea等标签元素有效。

name属性可以在在javascript中，使用getElementsByName()来查找元素；但无法在CSS或URL中被引用。例：

<script type="text/javascript">
function getElements()
 {
 var x=document.getElementsByName("myInput");
 alert(x.length);
 }
</script>
 
 
<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br />
<br />
<input type="button" onclick="getElements()" value="名为 'myInput' 的元素有多少个？" />

效果图：

学新通技术网

说明：

可以这样说，ID是一个人的身份证号码，而Name是这个人的名字。两者可以同时存在，共享相同的命名空间（两者的值可以相同）。

这篇好文章是转载于：学新通技术网

htmlid和name的区别是什么意思

html中的id属性

html中的name属性

photoshop保存的图片太大微信发不了怎么办

《学习通》视频自动暂停处理方法

Android 11 保存文件到外部存储，并分享文件

word里面弄一个表格后上面的标题会跑到下面怎么办

photoshop扩展功能面板显示灰色怎么办

微信公众号没有声音提示怎么办

excel下划线不显示怎么办

excel打印预览压线压字怎么办

怎样阻止微信小程序自动打开

TikTok加速器哪个好免费的TK加速器推荐