表单按钮链接和js按钮链接有什么区别？

Question

这两种将按钮变成链接的方式有什么区别：

<form method="GET" action="example.com">                
<button type="submit">button text</button>
</form>

VS

<button onclick="location.href = 'example.com';">button text</button>

效果一样，但是其中一种使用方式有什么缺陷吗？

Answer 1

是的。第一个将转到action URL，并将表单内的所有表单输入作为 GET 参数。

第二个是基于 javascript 事件的操作，它只转到带有您指定参数的 URL。

Answer 2

第一个：

<form method="GET" action="example.com">                
<button type="submit">button text</button>
</form>

优势：

1. 您可以将查询字符串数据 prams 发送到表单字段中的 url。
2. 可以很容易地形成复杂的链接，并将复杂的数据发送到Action url。

缺点：

1. 根据您的选择，没有任何缺点。
2. 无法生成动态链接 Action="" 属性不支持 java 脚本代码。

第二个：

<button onclick="location.href = 'example.com';">button text</button>

优势：

1. 您可以根据动态值变化生成链接。

   location.href = 'example.com'+document.getElementById('otherInput').value;

缺点：

1. 您不能以这种方式发送更多数据，这仅用作基本用途。