我一页上有一个div.它有一个onclick事件处理程序.当用户点击div时，我希望会调用事件处理程序.但是CSS规则也有:当div有焦点时，它会向右移动50个像素(远离鼠标指针).因此，onclick事件处理程序不会被调用，即使用户在开始时清楚地点击了div.就好像浏览器首先应用了CSS，然后才决定用户点击了什么.
我在这里做了一个简单的演示:https://jsbin.com/yalazam/edit?html,css,console,output点击第四列中的黄色方块(即the div)，然后查看第三列中的控制台.只会出现一条信息"focus square"，而不会出现一条信息"click square".
这种行为有意义吗？它有用吗？或者我应该把它当作浏览器的一种奇怪行为来接受吗？
此处的相关点包括点击事件的definition:
当指针位于元素内部时，同时按下和释放定点设备按钮(例如鼠标的主鼠标按钮)时，元素将接收
click事件.
这意味着在您的示例中，没有对目标div触发click事件，因为尽管鼠标按下发生在该div内，但释放发生在其移动后(除非用户做了一些不自然的事情)，因此不在同一元素内.在body上发生click事件will火灾(在您的示例中，这是MDN中提到的"最具体的祖先")，但这对您倾听并没有太大帮助——因为body上的click可能以许多其他方式发生，并且您不能使用事件的target属性来查看其起源，因为在本例中，正如所解释的，这就是body本身.
如果你需要这个效果，那么根据你感觉最自然的动作，使用mouseDown或mouseUp动作，而不是click动作.但真正的答案是不要这样做，因为这可能会让你的用户感到意外，并让他们感到烦恼.