如何html中标签上添加点击事件

方法一：直接在标签元素上添加

方法二：是通过js来添加

如图：

介绍：

HTML(Hyper Text Mark-up Language )即超文本标记语言，是 WWW 的描述语言，由 Tim Berners-lee提出。设计 HTML 语言的目的是为了能把存放在一台电脑中的文本或图形与另一台电脑中的文本或图形方便地联系在一起，形成有机的整体，人们不用考虑具体信息是在当前电脑上还是在网络的其它电脑上。

这样，你只要使用鼠标在某一文档中点取一个图标，Internet就会马上转到与此图标相关的内容上去，而这些信息可能存放在网络的另一台电脑中。

HTML文本是由 HTML命令组成的描述性文本，HTML 命令可以说明文字、 图形、动画、声音、表格、链接等。 HTML的结构包括头部 (Head)、主体 (Body) 两大部分。头部描述浏览器所需的信息，主体包含所要说明的具体内容。

常见的三种，一种是标签内联的书写方式，不推荐使用

另外两种都是相对比较常用的，具体看代码吧

方法1：标签内联的书写方式

<div onclick="alert('点击此处d窗')">HTML5学堂 - - 数百篇原创文章分享 </div>

方法2和方法3：

<div id="con">通过id获取标签，之后为标签绑定事件</div>

<script>

    var con = document.getElementById('con')

    con.onmouseover = function(){

        alert('鼠标移入d出这个')

    }

    con.addEventListener('mouseout', function(){

        alert('鼠标移出d出这个')

    }, false)

</script>

你说的是 javascript 函数 和 html 元素 的交互吗？

第一种方法：

两个部分：

javascript部分（相当于给出check（）接口。）：

<script language="javascript">

function check()

{

if { ……}

else{……}

}

</script>

html 部分（各种调用方法，相当于调用js的check（）接口,当点击后将运行JS函数。也可以将onclick改为其他如：onmouseover)：

<div onclick="check()"></div>

<form onsubmit="check()">

<input type="submit" >

</form>

<button onclick="check()"></button>

javascript是写事件的，html调用了这个事件。上文中的自定义事件名称check()，也可以自定义为其他，（）圆括号是必须有的。

第二种方法：

可以直接用javascript选择html元素，直接 *** 作元素。

<div id=click>click</div>

<script language="javascript">

var x=document.getElementById("click")

x.onclick = function()

{

alert("OK")

}

</script>

这种方法需要熟悉 HTML DOM。

---