Question

我注意到表单元素在HTML中也包含name参数，如下所示：

<input type="button" id="btnID" name="btnNAME" value="click me">

我真的不明白name的用法。在下面的代码片段中，我只是通过其id将btn的颜色更改为红色。 name属性的目的是什么？（一个例子会很好）

#btnID {
  background-color: red;
}

<input type="button" id="btnID" name="btnNAME" value="click me">

Answer 1

当您不通过它发送数据时，name属性不是必需的。表单输入元素的id可以实现使用JavaScript和CSS挂钩元素的目的。

name属性用于浏览器发送给服务器的HTTP请求，作为与value属性中包含的数据相关联的变量名。

这里我以在登录表单中使用php提取数据为例。如果你不懂php，你可能不会知道$_POST和$_GET。现在只知道它们用于提取使用此HTTP请求发送的数据。

<form action="login.php">
    <input type="text" name="user" value="kittyCat">
    <input type="password" name="password" value="querty123">
</form>

现在在login.php文件中，您可以提取如下数据：

$userName = $_POST['user'];
$password = $_POST['password'];

此处user指向第一个输入，因此$username将等于该输入的value，即"kittyCat"。类似地，$password将等于"qwerty123"。

Answer 2

使用表单控件的名称属性（例如input和select'），因为这是在表单提交时发生的POST或GET调用中使用的标识符。

Answer 3

NAME属性用于通过PHP获取元素的值，例如：

HTML w / PHP

<?php
if ($_SERVER['REQUEST_METHOD'] === 'POST'):
    $fn = $_POST['first_name'];
    echo $fn; // prints "Santa" on the page

    //or we can create something:

    ?><p><?php echo $fn; ?></p><?php // creates a p element w/ santa inside

endif;
?>

<form method="post">
<input type="text" name="first_name" value="Santa" />
<input type="submit" value="Do Something" />
</form>

提交HTML表单后，将运行一小段php代码。

您知道，您可以通过按名称抓取元素来使用CSS设置元素的样式，例如：

HTML

<input name="something" type="text" />

CSS

input[name="something"] { color: red; }

在表单元素中使用“name”属性？

3 个答案: