javaScript事件学习小结（四）event的公共成员（属性和方法）

首先，需要了解JavaScript中事件的公共成员包括属性和方法。属性包括类型(type)、目标(target)、当前目标(currentTarget)、时间戳(timeStamp)等，方法包括阻止默认事件(preventDefault)、停止冒泡(stopPropagation)等。

对于属性，可以在事件处理函数中使用event对象获取，例如：

<button onclick="alert(event.type)">点击我</button>

在上述示例中，点击按钮时会弹出一个提示框，显示出当前事件类型为click。

对于方法，可以在事件处理函数中使用event对象调用，例如：

document.querySelector('a').addEventListener('click', function (event) {
    event.preventDefault(); // 阻止链接跳转行为
    console.log('链接被点击');
});

在上述示例中，当用户单击一个链接时，会阻止默认的跳转行为，并输出一条信息到控制台上。

除此之外，还有其他常用的公共成员，例如：

• event.stopPropagation()：停止事件冒泡
• event.clientX / event.clientY：获取鼠标相对于浏览器窗口的水平/竖直坐标
• event.pageX / event.pageY：获取鼠标相对于文档的水平/竖直坐标
• event.keyCode / event.which：获取按下的键码或字符编码

总之，了解这些事件的公共成员，可以更好地处理JavaScript中的事件，从而增强web页面的交互性。

同时，在日常开发中，可以利用这些公共成员进行事件的相关控制，效果会更好。例如，可以在网站中增加一个提示框，当用户单击一个链接或按钮时，会弹出提示框。代码如下：

document.querySelector('a').addEventListener('click', function (event) {
    event.preventDefault(); // 阻止链接跳转行为
    alert('链接被点击');
});

document.querySelector('button').addEventListener('click', function (event) {
    alert('按钮被点击');
});

在上述示例中，当用户单击一个链接或按钮时，会弹出相应的提示框，从而提供更好的用户体验。