2014年辛星解读Javascript之DOM之事件及其绑定
Posted blfbuaa
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了2014年辛星解读Javascript之DOM之事件及其绑定相关的知识，希望对你有一定的参考价值。
我们通过DOM的事件能够对html的事件作出反应。就像我们用其它编程语言写GUI一样，那么HTML包含哪些事件呢？以下是几个常见的样例，比方网页已经完毕记载，图像完毕载入，鼠标移动到元素上方。输入文字被改变。表单提交。用户点击按键等等，还是蛮多的。
以下我们用实例来演示一下，看以下的HTML代码：
<html> <p id = "tag" onclick="this.innerHTML =‘小倩‘ ">辛星</p> </html>它本来是辛星的。假设我们点击一下，它就会变成”小倩“，这里的onclick事实上就是一个点击事件，双引號里面的就是javascript代码，那么既然是Javascript代码，我们最好还是把它们写到外面的script标签里面去，例如以下代码：
<html>
<p id = "tag" onclick="xin(this)">辛星</p>
<script type="text/javascript">
function xin(my){my.innerHTML = "小倩";}
</script>
</html>事实上功能和上面的代码是一样的，也是点击一下”辛星“。然后变成”小倩“。上面我们是直接写到了HTML代码里面，可能有人会问：能不能直接在Javascript中解决问题呢？答案是肯定的，例如以下代码：
<html>
<p id = "tag" >辛星</p>
<script type="text/javascript">
document.getElementById("tag").onclick = function(){
this.innerHTML = "小倩";
};
</script>
</html> 事实上也非常好理解。这也是DOM的一个绑定，仅仅是它直接在Javascript中完毕了事件的绑定。每次我们单击”辛星“这个事件触发的时候，它就会运行这个函数，这个函数的功能就是改变当中的文本显示信息。除了onclick事件之外，还有哪些事件比較重要一些呢？首先就是onload事件，它会在用户进入页面的时候触发，而onunload会在用户离开页面的时候触发。这两个事件对于处理cookie都是不错的，关于cookie我们后面会接触到。另一个就是onchange事件。它通常结合对输入字段的验证来使用，比方我们能够在输入框或者password框中使用该事件来检測用户输入的信息，而onmouseover则是在鼠标移动到HTML元素上方的时候触发。而onmouseout则是在鼠标从HTML元素上方移出的时候触发。相对于onclick这个点击过程来说，onmousedown、onmouseup就更加仔细入微了，前者表示我们用鼠标点击button的时候触发，后者则是我们松开的时候触发。
以上是关于2014年辛星解读Javascript之DOM之事件及其绑定的主要内容，如果未能解决你的问题，请参考以下文章