js 如何检测网页状态？

Question

比如网页弹出了一个对话框。
该如何实现，监测一个网页的状态是改变了？比如这个对话框是通过js或者jquery实现的，如何监测现在是跳出了一个对话框。

Answer 1

第一种情况，你用的是原生的alert, confirm之类的对话框，那不用检查状态变更，这种操作都是阻塞式的，一旦弹出，你的js都会停下来，等用户反馈。

第二种情况，用js实现一些DOM元素，然后通过css使其看起来有“弹出对话框”效果，可以如下几种方式分析问题：

1. 既然已知弹出框dom元素结构，那写个setInterval每隔一段时间检查下html里是否出现了这个“弹出框”元素，可以实现你想要的（当然这是最粗暴，且没水平的方式）

2. “弹出框”自己实现一个事件广播功能，每当弹出/关闭时，就广播一个事件出去，让其他侦听“弹出框”状态的地方可以受到通知

3. “弹出框”可以提供一个全局的方法，用来获取自身的状态，任何其他需要得知状态的地方都可以调用这个全局方法，获得状态

暂时只想到这么多了

Answer 2

jq

if($('#dialog').is(':visible')){
    //显示的代码
}else{
    //隐藏的代码
}

Answer 3

利用浏览器提供的事件驱动！

var element = document.getElementById("id");
element.click = function() {
    alert("点击了 element");
}

element.mouseover = function() {
    alert("鼠标在 element 上");
}