事件监听

####一、addEventListener的使用方式:

>target.addEventListener(type, listener, useCapture);

>target: 文档节点、document、window 或 XMLHttpRequest。

type: 字符串,事件名称,不含“on”,比如“click”、“mouseover”、“keydown”等。

listener :实现了 EventListener 接口或者是 JavaScript 中的函数。

useCapture :是否使用捕捉,一般用 false 。例如:document.getElementById("testText").addEventListener("keydown", function (event) { alert(event.keyCode); }, false);

######格式

*element*.addEventListener(*event*, *function*, *useCapture*)

|参数 |描述|

| :-------- | --------:| :--: |

|*event*|必须。字符串,指定事件名。**注意:** 不要使用 "on" 前缀。 例如,使用 "click" ,而不是使用 "onclick"。 **提示:** 所有 HTML DOM 事件,可以查看我们完整的 [HTML DOM Event 对象参考手册](http://www.runoob.com/jsref/dom-obj-event.html)。

|*function*|必须。指定要事件触发时执行的函数。 当事件对象会作为第一个参数传入函数。 事件对象的类型取决于特定的事件。例如, "click" 事件属于MouseEvent(鼠标事件) 对象。|

|*useCapture*|可选。布尔值,指定事件是否在捕获或冒泡阶段执行。可能值:true - 事件句柄在捕获阶段执行false- false- 默认。事件句柄在冒泡阶段执行|

####二、IE中:

>target.attachEvent(type, listener);

target: 文档节点、document、window 或 XMLHttpRequest。

type: 字符串,事件名称,含“on”,比如“onclick”、“onmouseover”、“onkeydown”等。

listener :实现了 EventListener 接口或者是 JavaScript 中的函数。 例如:document.getElementById("txt").attachEvent("onclick",function(event){alert(event.keyCode);});

>W3C 及 IE 同时支持移除指定的事件, 用途是移除设定的事件, 格式分别如下:

>>#####W3C格式:

>>removeEventListener(event,function,capture/bubble);

>>#####Windows IE的格式如下:

>>detachEvent(event,function);

####三、Javascript获取浏览器地址栏url

####1, window.location.href

整个URl字符串(在浏览器中就是完整的地址栏)

本例返回值: http://www.x2y2.com:80/fisker/post/0703/window.location.html?ver=1.0&id=6#imhere

####2,window.location.protocol

URL 的协议部分

本例返回值:http:

####3,window.location.host

URL 的主机部分

本例返回值:www.x2y2.com

####4,window.location.port

URL 的端口部分

如果采用默认的80端口(update:即使添加了:80),那么返回值并不是默认的80而是空字符

本例返回值:""

####5,window.location.pathname

URL 的路径部分(就是文件地址)

本例返回值:/fisker/post/0703/window.location.html

####6,window.location.search

查询(参数)部分

除了给动态语言赋值以外,我们同样可以给静态页面,并使用javascript来获得相信应的参数值

本例返回值:?ver=1.0&id=6

####7,window.location.hash

锚点

本例返回值:#imhere

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容