<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.div1{
color: #0000cc;
font-size: 20px;
}
</style>
</head>
<body>
<div>
<div onclick="func(this)" name="book1">hello 1</div>
<div onclick="func(this)" name="book2">hello 2</div>
<div onclick="func(this)" name="book3">hello 3</div>
<div onclick="func(this)" name="book4">hello 4</div>
</div>
<script> //onclick 绑定的函数 传参数 关键字this
function func(a) { // 点击后直接获取本点击对象
alert(a.getAttribute("name")); // 只能用getattribute 可以获得对象中的各种属性 name
alert(a.innerHTML); // 获取文本内容
a.setAttribute("class","div1") // 同样也可以给点击事件的对象 加入属性 class="div1"
} // div1 原来并没有加入 点击后 改变了字体大小颜色
</script>
</body>
</html>
js 中onclick 事件 点击后指向自己的对象,查找或者添加属性 用关键字this 传入参数 (可以改变原标签css)的相关教程结束。
