id和name属性之间有什么区别?它们似乎都具有提供标识符的相同目的。

我想知道(特别是关于HTML表单)是否出于任何原因需要或鼓励同时使用两者。


当前回答

Id:

它用于通过文档对象模型(DOM)(通过JavaScript或CSS样式)识别HTML元素。Id在页面中应该是唯一的。

名称对应于表单元素,并标识返回到服务器的内容。

例子:

<form action="action_page.php" id="Myform">
    First name: <input type="text" name="FirstName"><br>
    <input type="submit" value="Submit">
</form>

<p>The "Last name" field below is outside the form element, but still part of the form.</p>
Last name: <input type="text" name="LastName" form="Myform">

其他回答

在表单提交中发送数据时使用name属性。不同的控件响应不同。例如,您可能有几个具有不同id属性但名称相同的单选按钮。提交后,响应中只有一个值-您选择的单选按钮。

当然,这还不止于此,但它肯定会让你朝着正确的方向思考。

在这个问题一直存在的过程中,我很懊恼(也许有点难过),没有人想过提到可访问性,尽管它一直很重要,但它一直在管理层和软件工程师中稳步获得支持(仅从我的个人观察来看;没有硬数据支持)。

我可以提供的一个统计数据如下(来源):

因此,对可访问性缺点的认识呈现出稳步增长的趋势。同样的参考文献提到,从这些数字中,我们可以观察到每小时至少有一次诉讼被提起!

那么,可访问性如何影响姓名与身份?

根据万维网联盟(W3C):

标签的for属性必须与表单控件。

Id:

它用于通过文档对象模型(DOM)(通过JavaScript或CSS样式)识别HTML元素。Id在页面中应该是唯一的。

名称对应于表单元素,并标识返回到服务器的内容。

例子:

<form action="action_page.php" id="Myform">
    First name: <input type="text" name="FirstName"><br>
    <input type="submit" value="Submit">
</form>

<p>The "Last name" field below is outside the form element, but still part of the form.</p>
Last name: <input type="text" name="LastName" form="Myform">

<body><form action=“”><label for=“username”>用户名</label><input type=“text”id=“username”name=“username“><button>提交</按钮></form></body>

正如我们在这里看到的,“id”和“for”元素是相互关联的。如果单击标签(用户名),则输入字段将突出显示(这对移动用户很有用,被认为是一种良好的做法)。

另一方面,“name”元素在提交表单时很有用。无论您在输入字段中输入什么,它都将显示在URL上。请参阅随附的图片。

<form action="demo_form.asp">
    <label for="male">Male</label>
    <input type="radio" name="sex" id="male" value="male"><br>

    <label for="female">Female</label>
    <input type="radio" name="sex" id="female" value="female"><br>

    <input type="submit" value="Submit">
</form>