<form>里的<input type="submit" value="Submit">和我直接定义的一个<button type="button" onclick="sendData(1)">点亮 LED</button> 的区别是什么

`<input type="submit">`和`<button type="button">`的最大区别在于它们的默认行为和功能不同。

`<input type="submit">`是一个用于提交表单的按钮，当用户单击该按钮时，表单数据将被提交到服务器上进行处理。`<input>`标签的`type`属性默认值为`submit`，所以如果您不指定该属性，该元素将被渲染成一个提交按钮。

`<button type="button">`是一个普通按钮，它不会自动提交表单。当用户单击该按钮时，可以执行任何JavaScript代码来完成自己的逻辑。在上面的代码中，`<button>`标签的`onclick`属性设置了一个名为`sendData`的JavaScript函数，用于实现控制LED灯的逻辑。

因此，当您想要创建用于提交表单的按钮时，应该使用`<input type="submit">`标签。而当您想要创建一个普通按钮并执行自己的JavaScript逻辑时，应该使用`<button>`标签。

相关问题

<button onclick="sendData('on')">开灯</button> <button onclick="sendData('off')">关灯</button> <script> function sendData(status) { var xhr = new XMLHttpRequest(); xhr.open("GET", "http://192.168.1.100/led?status=" + status, true); xhr.send(); } </script>和<form action="http://192.168.1.100/led" method="POST"> <input type="hidden" name="status" value="on"> <button type="submit">开灯</button> </form>有什么不同

这两段代码实现的功能都是控制 ESP8266 板上的 LED 灯，但是使用的方法不同。

第一段代码使用了 XMLHttpRequest 对象来发送 HTTP GET 请求，请求的 URL 中传递了 LED 灯的控制命令。这种方式不需要使用表单，可以直接通过 JavaScript 代码来控制 LED 灯。

第二段代码使用了表单来提交数据，表单中包含了一个隐藏域 `<input type="hidden">` 用来存储 LED 灯的控制命令。当用户点击提交按钮时，表单会自动将数据发送到服务器。这种方式需要使用表单，比较适合需要用户输入数据或提交表单数据的场景。

总的来说，这两种方式都可以实现控制 LED 灯的功能，但是具体使用哪种方式需要根据实际需求来选择。如果只需要简单地控制 LED 灯，可以使用第一种方式；如果需要用户输入数据或提交表单数据，可以使用第二种方式。

<button onclick="sendData('on')">开灯</button>按键控件不是应该放在form中吗？

按键控件 `<button>` 并不一定要放在 `<form>` 中，它可以单独使用，也可以和表单一起使用。在控制 ESP8266 板上的 LED 灯这个场景下，我们只需要通过点击按钮来向服务器发送请求，不需要提交表单数据，所以不需要使用 `<form>` 标签。

当需要使用表单来提交数据时，我们可以将按钮放在表单中，例如：

<form action="http://192.168.1.100/led" method="POST">
  <input type="hidden" name="status" value="on">
  <button type="submit">开灯</button>
</form>

在这个表单中，我们使用了一个隐藏域 `<input type="hidden">` 来存储 LED 灯的控制命令，当用户点击提交按钮时，表单会自动将数据发送到服务器。这种方式在需要提交表单数据时比较常见。