上海网络广告推广平台,seo优化销售,建网站流程,网站开发使用的语言类本文实例总结了Javascript DOM事件操作。分享给大家供大家参考#xff0c;具体如下#xff1a;使用JavaScript可以对HTML页面上的各种事件进行监听#xff0c;如鼠标点击/释放#xff0c;鼠标悬停/离开#xff0c;等等。效果图#xff1a;代码#xff1a;/pht…本文实例总结了Javascript DOM事件操作。分享给大家供大家参考具体如下使用JavaScript可以对HTML页面上的各种事件进行监听如鼠标点击/释放鼠标悬停/离开等等。效果图代码/phttp://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtdJavascript 事件body {background-color:#eeeeee}div.greenBtn{color:white;background-color:green;width:200px;height:20px;text-align:center;padding-top:20px;padding-bottom:20px;}button.greenBtn{color:white;background-color:green;width:200px;height:50px;text-align:center;border:0px;}(一)点击时改变HTML元素内容1.直接改变请点击文字2.通过函数改变请点击文字function changeText(ele){ele.innerHTML 谢谢;}function checkCookies(){if (navigator.cookieEnabled){// alert(已启用 cookie)}else{// alert(未启用 cookie)}}(二)onload 和 onunload 事件onload 和 onunload 事件会在用户进入或离开页面时被触发。onload 事件可用于检测访问者的浏览器类型和浏览器版本并基于这些信息来加载网页的正确版本。onload 和 onunload 事件可用于处理 cookie(三)onchange事件请输入英文字符当您离开输入字段时会触发将输入文本转换为大写的函数。function toUpper(ele){ele.value ele.value.toUpperCase();}(四)onmouseover 和 onmouseout 事件把鼠标放在上面function mOver(ele){ele.innerHTML 谢谢}function mOut(ele){ele.innerHTML 把鼠标放在上面}(五)onmousedown、onmouseup 以及 onclick 事件鼠标抬起function mDown(ele){ele.innerHTML 鼠标已按下ele.style.backgroundColor blue}function mUp(ele){ele.innerHTML 鼠标抬起ele.style.backgroundColor green}(六)onfocus 事件当输入框获取焦点时改变其背景色onfocus changeBgColor(this,true)οnblurchangeBgColor(this,false)function changeBgColor(ele,hasFocus){if(hasFocus){ele.style.backgroundColor yellow}else{ele.style.backgroundColor gray}}PS:关于javascript常用事件及相关说明还可参考本站在线工具希望本文所述对大家JavaScript程序设计有所帮助。
