HTML两大点击元素:button和a_html button a-优快云博客

本文链接：https://blog.youkuaiyun.com/JavaIdot/article/details/122522480

前言

今天，您将学习到两大点击元素button和a（按钮和超链接）的用法。还有拓展如何让超链接像按钮一样有点击事件。如果拓展让您感到有所帮助，不忘点赞加关注！

按钮 button

html的小伙伴们都知道，想在网页中显示一个网页得用button元素。

<button onclick="function()">a button</button>

onclick是一个函数，按钮点击后会发生function()的事件，这个function()是在js定义的。

一个实例：

<html>

<body>

<button onclick="func()">Click me Please!</button>
<h1 id="text"></h1>

</body>

<script>

function func(){
    var element = document.getElementById("text");//获取上边的h1对象
    element.innterHTML = "您已经触发了func()!";//修改文字内容
}

</script>

</html>

运行之后，您的网页右上角会有一个按钮，点击之后，您会发现下边多了一行字。

超链接 a

a 元素也是一个较为常见的元素，表超链接。

<a href="https://www.youkuaiyun.com/">点此超链接进入csdn</a>

同学们如果看了效果，应该很快就会理解。href里面的值便是你点击后所显示的网页。

拓展:让a元素也有点击事件

然而大部分的网页的按钮都被超链接所代替，那么如何让超链接也有点击事件呢？不妨先猜一下。

有的同学可能作出下面的代码：

<a href="" onclick="func()"></a>

这种方法不可取！运行之后，您可能发现一些bug。为了保险，正确的方法是：

<a href="#" onclick="func()"></a>

这样就可以了。

总结

如果对您有所帮助，不忘点赞关注！