操作方法
我们先建立一个html文件，我建立的是html5文件代码如下 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <div>这是要点击的盒子</div> </body> </html>
给div加css样式代码如下 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> div{ width: 300px; height: 300px; margin: 200px auto; background: #ccc; } </style> </head> <body> <div>这是要点击的盒子</div> </body> </html>
添加js触发样式文件 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> div{ width: 300px; height: 300px; margin: 200px auto; background: #ccc; } </style> <script type="text/javascript"> function jiazai() { var dv = document.getElementsByTagName('div')[0]; dv.onclick = function(){ alert('123'); } } </script> </head> <body> <div>这是要点击的盒子</div> </body> </html>
下面最重要的一步，让文件先加载html文件、css文件最后加载js样式文件 window.onload = jiazai;