{"id":2330,"date":"2012-04-01T18:06:42","date_gmt":"2012-04-01T10:06:42","guid":{"rendered":"http:\/\/www.zhangxinxu.com\/wordpress\/?p=2330"},"modified":"2018-01-02T01:25:55","modified_gmt":"2018-01-01T17:25:55","slug":"js-dom%e8%87%aa%e5%ae%9a%e4%b9%89%e4%ba%8b%e4%bb%b6","status":"publish","type":"post","link":"https:\/\/www.zhangxinxu.com\/wordpress\/2012\/04\/js-dom%e8%87%aa%e5%ae%9a%e4%b9%89%e4%ba%8b%e4%bb%b6\/","title":{"rendered":"\u6f2b\u8c08js\u81ea\u5b9a\u4e49\u4e8b\u4ef6\u3001DOM\/\u4f2aDOM\u81ea\u5b9a\u4e49\u4e8b\u4ef6"},"content":{"rendered":"

by zhangxinxu<\/a> from http:\/\/www.zhangxinxu.com<\/a>
\n\u672c\u6587\u5730\u5740\uff1ahttp:\/\/www.zhangxinxu.com\/wordpress\/?p=2330<\/a><\/p>\n

\u4e00\u3001\u8bf4\u660e\u3001\u5f15\u8a00<\/h3>\n

\u6211JS\u8fd8\u662f\u6bd4\u8f83\u8584\u5f31\u7684\uff0c\u672c\u6587\u7684\u5185\u5bb9\u5c5e\u4e8e\u8fb9\u5b66\u8fb9\u60f3\u8fb9\u6298\u817e\u7684\u788e\u788e\u5ff5\uff0c\u53ef\u80fd\u6ca1\u4ec0\u4e48\u6761\u7406\uff0c\u53ef\u80fd\u6709\u8868\u8ff0\u4e0d\u51c6\u786e\u7684\u5730\u65b9\uff0c\u53ef\u80fd\u5185\u5bb9\u6bd4\u8f83\u62d7\u53e3\u751f\u50fb\u3002\u5982\u679c\u60a8\u65f6\u95f4\u7d27\u8feb\uff0c\u6216\u8005JS\u9020\u8be3\u5df2\u6df1\uff0c\u81f3\u6b64\u60a8\u5c31\u53ef\u4ee5\u70b9\u51fb\u53f3\u4fa7\u5e7f\u544a\uff08\u6728\u6709\uff1f\u5219RSS\u6216\u76d7\u7248\uff09\u7136\u540e\u64a4\u4e86\u3002<\/p>\n

\u4e8b\u4ef6\u662f\u4e2a\u5927\u8bfe\u9898\uff0c\u771f\u8981\u4ece\u65ad\u5976\u5f00\u59cb\u8bb2\u8d77\u7684\u8bdd\uff0c\u53ef\u4ee5\u5199\u4e2a12\u671f\u7684\u8fde\u8f7d\u3002\u5173\u4e8eJS\u4e8b\u4ef6\u7684\u6587\u7ae0\uff08\u7c7b\u4f3cDOM\/BOM\u4e8b\u4ef6\u6a21\u578b\uff0cIE\u4e0e\u5176\u4ed6\u6d4f\u89c8\u5668\u4e8b\u4ef6\u5dee\u5f02\uff0cDOM1\/DOM2\u4e8b\u4ef6\u5b9a\u4e49\u7b49\uff09\u843d\u53f6\u822c\u968f\u5904\u53ef\u89c1\u3002\u719f\u8c46\u5b50\u53cd\u590d\u7092\u4e00\u70b9\u610f\u601d\u90fd\u6ca1\u6709\uff0c\u56e0\u6b64\uff0c\u8fd9\u91cc\u8c08\u8c08\u81ea\u5df1\u611f\u5174\u8da3\u7684\u81ea\u5b9a\u4e49\u4e8b\u4ef6\u4ee5\u53ca\u5468\u8fb9\u3002<\/p>\n

\u6240\u8c13\u81ea\u5b9a\u4e49\u4e8b\u4ef6\uff0c\u5c31\u662f\u6709\u522b\u4e8e\u6709\u522b\u4e8e\u5e26\u6709\u6d4f\u89c8\u5668\u7279\u5b9a\u884c\u4e3a\u7684\u4e8b\u4ef6(\u7c7b\u4f3cclick<\/code>, mouseover<\/code>, submit<\/code>, keydown<\/code>\u7b49\u4e8b\u4ef6)\uff0c\u4e8b\u4ef6\u540d\u79f0\u53ef\u4ee5\u968f\u610f\u5b9a\u4e49\uff0c\u53ef\u4ee5\u901a\u8fc7\u7279\u5b9a\u7684\u65b9\u6cd5\u8fdb\u884c\u6dfb\u52a0\uff0c\u89e6\u53d1\u4ee5\u53ca\u5220\u9664\u3002<\/p>\n

\u4e8c\u3001JS\u81ea\u5b9a\u4e49\u4e8b\u4ef6<\/h3>\n

\u5faa\u5e8f\u6e10\u8fdb\u4fbf\u4e8e\u63a5\u6536\u3002\u6162\u6162\u6765~~<\/p>\n

\u5148\u770b\u4e2a\u7b80\u5355\u7684\u4e8b\u4ef6\u6dfb\u52a0\u7684\u4f8b\u5b50\uff1a<\/p>\n

\n
element.addEventListener(\"click\", function() {\n    \/\/ \u6211\u662f\u4e34\u65f6\u5de5<\/span>\n});<\/pre>\n<\/div>\n
\u8fd9\u662f\u4e2a\u7b80\u5355\u7684\u4e3aDOM\u5143\u7d20\u5206\u914d\u4e8b\u4ef6\u5904\u7406\u51fd\u6570\u7684\u65b9\u6cd5(IE \u4e0d\u652f\u6301)\uff0c\u6709\u522b\u4e8e\uff1a<\/p>\n
\n
element.onclick = function() {\n   \/\/ \u6211\u662f\u4e34\u65f6\u5de5<\/span> \n};<\/pre>\n<\/div>\n
addEventListener()<\/code>\u53ef\u4ee5\u4e3a\u5143\u7d20\u5206\u914d\u591a\u4e2a\u5904\u7406\u51fd\u6570\uff08\u800c\u975e\u8986\u76d6\uff09\uff0c\u56e0\u6b64\uff0c\u6211\u4eec\u53ef\u4ee5\u7ee7\u7eed\uff1a<\/p>\n
\n
element.addEventListener(\"click\", function() {\n    \/\/ \u6211\u662f\u4e8c\u4ee3\u4e34\u65f6\u5de5<\/span>\n});<\/pre>\n<\/div>\n
\u7136\u540e\uff0c\u5f53element<\/code>\u88abclick(\u70b9\u51fb)\u7684\u65f6\u5019\uff0c\u5c31\u4f1a\u8fde\u7eed\u89e6\u53d1\u201c\u4e34\u65f6\u5de5\u201d\u548c\u201c\u4e8c\u4ee3\u4e34\u65f6\u5de5\u201d\u51fd\u6570\u3002<\/p>\n
\u62bd\u8c61\u2192\u5177\u8c61\u2192\u672c\u8d28\u2192\u6570\u636e\u5c42<\/strong>
\u4f60\u6709\u6ca1\u6709\u89c9\u5f97\u8fd9\u79cd\u884c\u4e3a\u8868\u73b0\u6709\u70b9\u7c7b\u4f3c\u4e8e\u5f80\u957f\u67aa\u91cc\u9762\u585e\u5b50\u5f39(add)\uff0c\uff08\u6263\u52a8\u6273\u624b – click\uff09\u53d1\u5c04\u7684\u65f6\u5019\u6309\u7167\u585e\u8fdb\u53bb\u7684\u987a\u5e8f\u4f9d\u6b21\u51fa\u6765\u3002\u8fd9\u79cd\u884c\u4e3a\u8868\u73b0\u4e3a\u6211\u4eec\u5b9e\u73b0\u81ea\u5b9a\u4e49\u4e8b\u4ef6\u63d0\u4f9b\u4e86\u601d\u8def\uff1a\u6211\u4eec\u53ef\u4ee5\u5b9a\u4e49\u4e00\u4e2a\u6570\u7ec4\uff0c\u5f53\u6dfb\u52a0\u4e8b\u4ef6\u7684\u65f6\u5019\uff0c\u6211\u4eecpush\u8fdb\u53bb\u8fd9\u4e2a\u4e8b\u4ef6\u5904\u7406\u51fd\u6570\uff1b\u5f53\u6211\u4eec\u6267\u884c\u7684\u65f6\u5019\uff0c\u4ece\u5934\u904d\u5386\u8fd9\u4e2a\u6570\u7ec4\u4e2d\u7684\u6bcf\u4e2a\u4e8b\u4ef6\u5904\u7406\u51fd\u6570\uff0c\u5e76\u6267\u884c\u3002<\/p>\n
\u5f53\u591a\u4e2a\u4e8b\u4ef6\u4ee5\u53ca\u5bf9\u5e94\u6570\u636e\u5904\u7406\u51fd\u6570\u6dfb\u52a0\u540e\uff0c\u6211\u4eec\u6700\u7ec8\u4f1a\u5f97\u5230\u4e00\u4e2a\u7c7b\u4f3c\u4e0b\u9762\u6570\u636e\u7ed3\u6784\u7684\u5bf9\u8c61\uff1a<\/p>\n
\n
\n_listener = {\n    \"click\": [func1, func2],\n    \"custom\": [func3],\n    \"defined\": [func4, func5, func6]\n}\n<\/pre>\n<\/div>\n
\u56e0\u6b64\uff0c\u5982\u679c\u6211\u4eec\u8131\u79bbDOM, \u7eaf\u788e\u5728\u6570\u636e\u5c42\u9762\u81ea\u5b9a\u4e49\u4e8b\u4ef6\u7684\u8bdd\uff0c\u6211\u4eec\u53ea\u8981\u4ee5\u6784\u5efa\u3001\u904d\u5386\u548c\u5220\u9664_listener<\/code>\u5bf9\u8c61\u4e3a\u76ee\u7684\u5373\u53ef\u3002<\/p>\n
\u51fd\u6570\u5f0f\u5b9e\u73b0<\/strong>
\u8fd8\u662f\u90a3\u53e5\u8bdd\uff0c\u5faa\u5e8f\u6e10\u8fdb\uff0c\u6211\u4eec\u5148\u770b\u770b\u51fd\u6570\u5f0f\u7684\u5b9e\u73b0\uff08\u53ea\u5c55\u793a\u9aa8\u5e72\u4ee3\u7801\uff09\uff1a<\/p>\n
\n
\nvar _listener = {};\nvar addEvent = function(type, fn) {\n    \/\/ \u6dfb\u52a0<\/span>\n};\nvar fireEvent = function(type) {\n    \/\/ \u89e6\u53d1<\/span>\n};\nvar removeEvent = function(type, fn) {\n    \/\/ \u5220\u9664<\/span>\n};\n<\/pre>\n<\/div>\n
\u4e0a\u9762\u7684\u4ee3\u7801\u867d\u7136\u663e\u5f97\u6bd4\u8f83\u521d\u7ea7\uff0c\u4f46\u662f\u76ee\u7684\u4ea6\u53ef\u5b9e\u73b0\u3002\u4f8b\u5982\uff1a<\/p>\n
\n
addEvent(\"alert\", function() {\n    alert(\"\u5f39\u51fa\uff01\");\n});\n\n\/\/ \u89e6\u53d1\u81ea\u5b9a\u4e49alert\u4e8b\u4ef6<\/span>\nfireEvent(\"alert\");<\/pre>\n<\/div>\n
\u4f46\u662f\uff0c\u51fd\u6570\u5f0f\u5199\u6cd5\u7f3a\u70b9\u663e\u800c\u6613\u89c1\uff0c\u8fc7\u591a\u66b4\u9732\u5728\u5916\u7684\u5168\u5c40\u53d8\u91cf\uff08\u5168\u5c40\u53d8\u91cf\u662f\u9b54\u9b3c\uff09\uff0c\u65b9\u6cd5\u65e0\u7ea7\u8054\u7b49\u3002\u8fd9\u4e5f\u662f\u4e0a\u9762\u61d2\u5f97\u663e\u793a\u5b8c\u6574\u4ee3\u7801\u7684\u539f\u56e0\uff0c\u7565\u77e5\u5373\u53ef\u3002<\/p>\n
\u5b57\u9762\u91cf\u5b9e\u73b0<\/strong>
\u4f17\u6240\u5468\u77e5\uff0c\u51cf\u5c11\u5168\u5c40\u53d8\u91cf\u7684\u65b9\u6cd5\u4e4b\u4e00\u5c31\u662f\u4f7f\u7528\u5168\u5c40\u53d8\u91cf\uff08\u5176\u4ed6\u5982\u95ed\u5305\uff09\u3002\u4e8e\u662f\uff0c\u6211\u4eec\u7a0d\u4f5c\u8c03\u6574\uff08\u4ee3\u7801\u8f83\u957f\uff0c\u4e3a\u9650\u5236\u7bc7\u5e45\uff0c\u4f7f\u7528\u4e86\u6eda\u52a8\u6761\uff0c\u5b8c\u6574\u663e\u793a\u70b9\u51fb\u8fd9\u91cc<\/a> – JS\u4ea4\u4e92,  RSS\u4e2d\u65e0\u6548\u679c<\/span>\uff09\uff1a<\/p>\n
\n
var Event = {\n    _listeners: {},    \n    \/\/ \u6dfb\u52a0<\/span>\n    addEvent<\/span>: function(type, fn) {\n        if (typeof this._listeners[type] === \"undefined\") {\n            this._listeners[type] = [];\n        }\n        if (typeof fn === \"function\") {\n            this._listeners[type].push(fn);\n        }    \n        return this;\n    },\n    \/\/ \u89e6\u53d1<\/span>\n    fireEvent<\/span>: function(type) {\n        var arrayEvent = this._listeners[type];\n        if (arrayEvent instanceof Array) {\n            for (var i=0, length=arrayEvent.length; i<length; i+=1) {\n                if (typeof arrayEvent[i] === \"function\") {\n                    arrayEvent[i]({ type: type });    \n                }\n            }\n        }    \n        return this;\n    },\n    \/\/ \u5220\u9664<\/span>\n    removeEvent<\/span>: function(type, fn) {\n    \tvar arrayEvent = this._listeners[type];\n        if (typeof type === \"string\" && arrayEvent instanceof Array) {\n            if (typeof fn === \"function\") {\n                \/\/ \u6e05\u9664\u5f53\u524dtype\u7c7b\u578b\u4e8b\u4ef6\u4e0b\u5bf9\u5e94fn\u65b9\u6cd5<\/span>\n                for (var i=0, length=arrayEvent.length; i<length; i+=1){\n                    if (arrayEvent[i] === fn){\n                        this._listeners[type].splice(i, 1);\n                        break;\n                    }\n                }\n            } else {\n                \/\/ \u5982\u679c\u4ec5\u4ec5\u53c2\u6570type, \u6216\u53c2\u6570fn\u90aa\u9b54\u5916\u9053\uff0c\u5219\u6240\u6709type\u7c7b\u578b\u4e8b\u4ef6\u6e05\u9664<\/span>\n                delete this._listeners[type];\n            }\n        }\n        return this;\n    }\n};<\/pre>\n<\/div>\n
\u4f7f\u7528\u7c7b\u4f3c\u4e0b\u9762\uff1a<\/p>\n
\n
Event.addEvent<\/span>(\"alert\", function() {\n    alert(\"\u5f39\u51fa\uff01\");\n});\n\n\/\/ \u89e6\u53d1\u81ea\u5b9a\u4e49alert\u4e8b\u4ef6<\/span>\nEvent.fireEvent<\/span>(\"alert\");<\/pre>\n<\/div>\n
\u60a8\u53ef\u4ee5\u72e0\u72e0\u5730\u70b9\u51fb\u8fd9\u91cc\uff1aJS\u81ea\u5b9a\u4e49\u4e8b\u4ef6\u5b57\u9762\u91cf\u4e66\u5199demo<\/a><\/p>\n
\u9ed8\u8ba4\u9875\u9762document<\/code>\u901a\u8fc7Event.addEvent()<\/code>\u7ed1\u5b9a\u4e86\u4e24\u4e2a\u81ea\u5b9a\u4e49\u7684alert<\/code>\u4e8b\u4ef6\uff0c\u56e0\u6b64\uff0c\u6b64\u65f6\u60a8\u70b9\u51fb\u9875\u9762\u7684\u7a7a\u767d\u533a\u57df\uff08\u975e\u6309\u94ae\u4e0e\u793a\u4f8b\u4ee3\u7801\u533a\u57df\uff09\uff0c\u5c31\u4f1a\u6709\u5982\u4e0b\u56fe\u6240\u793a\u7684\u8fde\u7eed\u4e24\u4e2aalert\u6846\uff1a<\/p>\n
 <\/p>\n
demo\u9875\u9762\u8fd8\u6709\u4e24\u4e2a\u6309\u94ae\uff0c\u7528\u6765\u6e05\u9664\u5df2\u7ecf\u7ed1\u5b9a\u7684alert<\/code>\u4e8b\u4ef6\u3002\u7b2c\u4e00\u4e2a\u6309\u94ae\u6e05\u9664\u6240\u6709alert<\/code>\u4e8b\u4ef6\uff0c\u800c\u70b9\u51fb\u7b2c\u4e8c\u4e2a\u6309\u94ae\u6e05\u9664\u7b2c\u4e00\u4e2aalert<\/code>\u4e8b\u4ef6\u3002\u4f8b\u5982\u6211\u4eec\u70b9\u51fb\u7b2c\u4e8c\u4e2a\u6309\u94ae\uff1a<\/p>\n
<\/p>\n
\u6e05\u9664\u5b8c\u6bd5\u540e\u518d\u70b9\u51fb\u9875\u9762\u7684\u7a7a\u767d\u533a\u57df\uff0c \u60a8\u4f1a\u53d1\u73b0\u53ea\u4f1a\u5f39\u51fa\u201c\u7b2c\u4e8c\u4e2a\u5f39\u51fa\uff01\u201d\u5b57\u6837\u7684\u5f39\u51fa\u6846\u4e86\u3002\u8fd9\u8868\u660e\uff0c\u7b2c\u4e00\u4e2a\u7ed1\u5b9a\u81ea\u5b9a\u4e49\u4e8b\u4ef6\u88abremove\u6389\u4e86\u3002<\/p>\n
\u5b57\u9762\u91cf\u5b9e\u73b0\u867d\u7136\u51cf\u5c11\u4e86\u5168\u5c40\u53d8\u91cf\uff0c\u4f46\u662f\u5176\u5c5e\u6027\u65b9\u6cd5\u7b49\u90fd\u662f\u66b4\u9732\u800c\u4e14\u90fd\u662f\u552f\u4e00\u7684\uff0c\u4e00\u65e6\u67d0\u4e2a\u5173\u952e\u5c5e\u6027(\u5982_listeners<\/code>)\u4e0d\u5c0f\u5fc3\u5728\u67d0\u4e8b\u4ef6\u5904reset\u4e86\u4e0b\uff0c\u5219\u6574\u4e2a\u5168\u5c40\u7684\u81ea\u5b9a\u4e49\u4e8b\u4ef6\u90fd\u4f1a\u5d29\u6e83\u3002\u56e0\u6b64\uff0c\u6211\u4eec\u53ef\u4ee5\u8fdb\u4e00\u6b65\u6539\u8fdb\uff0c\u4f8b\u5982\uff0c\u4f7f\u7528\u539f\u578b\u94fe\u7ee7\u627f\uff0c\u8ba9\u7ee7\u627f\u7684\u5c5e\u6027(\u5982_listeners<\/code>)\u5373\u4f7f\u51fa\u95ee\u9898\u4e5f\u4e0d\u4f1a\u5f71\u54cd\u5168\u5c40\u3002<\/p>\n
\u539f\u578b\u6a21\u5f0f\u5b9e\u73b0<\/strong>
\u4ee3\u7801\u5982\u4e0b\uff08\u76f8\u6bd4\u4e0a\u9762\u589e\u52a0\u4e86addEvents<\/code>, fireEvents<\/code>, removeEvents<\/code>\u591a\u4e8b\u4ef6\u7ed1\u5b9a\u3001\u6267\u884c\u4e0e\u5220\u9664\u65b9\u6cd5\uff0c\u7bc7\u5e45\u8f83\u957f\uff0c\u589e\u52a0\u6eda\u52a8\u9650\u9ad8\uff0c\u70b9\u51fb\u8fd9\u91cc\u5b8c\u6574\u5c55\u793a<\/a> – JS\u4ea4\u4e92,  RSS\u4e2d\u65e0\u6548\u679c<\/span>\uff09\uff08\u4e00\u5806\u4ee3\u7801\u770b\u5f97\u5934\u5927\uff0c\u5efa\u8bae\u76f4\u63a5\u8df3\u8fc7\uff09\uff1a<\/p>\n
\n
var EventTarget = function() {\n    this._listener = {};\n};\n\nEventTarget.prototype = {\n    constructor: this,\n    addEvent<\/span>: function(type, fn) {\n        if (typeof type === \"string\" && typeof fn === \"function\") {\n            if (typeof this._listener[type] === \"undefined\") {\n                this._listener[type] = [fn];\n            } else {\n                this._listener[type].push(fn);    \n            }\n        }\n        return this;\n    },\n    addEvents<\/span>: function(obj) {\n        obj = typeof obj === \"object\"? obj : {};\n        var type;\n        for (type in obj) {\n            if ( type && typeof obj[type] === \"function\") {\n                this.addEvent(type, obj[type]);    \n            }\n        }\n        return this;\n    },\n    fireEvent<\/span>: function(type) {\n        if (type && this._listener[type]) {\n            var events = {\n                type: type,\n                target: this    \n            };\n            \n            for (var length = this._listener[type].length, start=0; start<length; start+=1) {\n                this._listener[type][start].call(this, events);\n            }\n        }\n        return this;\n    },\n    fireEvents<\/span>: function(array) {\n        if (array instanceof Array) {\n            for (var i=0, length = array.length; i<length; i+=1) {\n                this.fireEvent(array[i]);\n            }\n        }\n        return this;\n    },\n    removeEvent<\/span>: function(type, key) {\n        var listeners = this._listener[type];\n        if (listeners instanceof Array) {\n            if (typeof key === \"function\") {\n                for (var i=0, length=listeners.length; i<length; i+=1){\n                    if (listeners[i] === key){\n                        listeners.splice(i, 1);\n                        break;\n                    }\n                }\n            } else if (key instanceof Array) {\n                for (var lis=0, lenkey = key.length; lis<lenkey; lis+=1) {\n                    this.removeEvent(type, key[lenkey]);\n                }\n            } else {\n                delete this._listener[type];\n            }\n        }\n        return this;\n    },\n    removeEvents<\/span>: function(params) {\n        if (params instanceof Array) {\n            for (var i=0, length = params.length; i<length; i+=1) {\n                this.removeEvent(params[i]);\n            }    \n        } else if (typeof params === \"object\") {\n            for (var type in params) {\n                this.removeEvent(type, params[type]);    \n            }\n        }\n        return this;    \n    }\n};<\/pre>\n<\/div>\n
\u5570\u54e9\u5427\u55e6\u7684\u4ee3\u7801\u76f4\u63a5\u8df3\u8fc7\uff0c\u5176\u5b9e\u4e0a\u9762\u4ee3\u7801\u8ddf\u5b57\u9762\u91cf\u65b9\u6cd5\u76f8\u6bd4\uff0c\u5c31\u662f\u589e\u52a0\u4e86\u4e0b\u9762\u70b9\u4e1c\u897f\uff1a<\/p>\n
\n
var EventTarget = function() {\n    this._listener = {};\n};\n\nEventTarget.prototype = {\n    constructor: this,\n    \/\/ .. \u5b8c\u5168\u5c31\u662f\u5b57\u9762\u91cf\u6a21\u5f0f\u5b9e\u73b0\u811a\u672c<\/span>\n};<\/pre>\n<\/div>\n
\u7136\u540e\uff0c\u9700\u8981\u5b9e\u73b0\u81ea\u5b9a\u4e49\u4e8b\u4ef6\u529f\u80fd\u65f6\u5019\uff0c\u5148new<\/code>\u6784\u9020\u4e0b\uff1a<\/p>\n
\n
var myEvents = new EventTarget();\nvar yourEvents = new EventTarget();<\/pre>\n<\/div>\n
\u8fd9\u6837\uff0c\u5373\u4f7fmyEvents<\/code>\u7684\u4e8b\u4ef6\u5bb9\u5668_listener<\/code>\u8ddb\u6389\uff0c\u4e5f\u4e0d\u4f1a\u6c61\u67d3yourEvents<\/code>\u4e2d\u7684\u81ea\u5b9a\u4e49\u4e8b\u4ef6(_listener<\/code>\u5b89\u7136\u65e0\u6059)\u3002<\/p>\n
\u60a8\u53ef\u4ee5\u72e0\u72e0\u5730\u70b9\u51fb\u8fd9\u91cc\uff1a\u539f\u578b\u6a21\u5f0f\u4e0b\u7684JS\u81ea\u5b9a\u4e49\u4e8b\u4ef6demo<\/a><\/p>\n
\u4ecedemo\u53f3\u534a\u533a\u57df\u7684\u6e90\u4ee3\u7801\u5c55\u793a\u53ef\u4ee5\u770b\u51fa\u5982\u4f55\u4f7f\u7528addEvents<\/code>, fireEvents<\/code>\u65b9\u6cd5\u540c\u65f6\u6dfb\u52a0\u548c\u89e6\u53d1\u591a\u4e2a\u81ea\u5b9a\u4e49\u4e8b\u4ef6\u7684\u3002<\/p>\n
<\/p>\n
\/\/zxx: \u4e0b\u9762\u4e3a\u5e7f\u544a~~\u6ce8\u610f\u4e0d\u8981\u52ff\u70b9~~\u563b\u563b~~<\/p>\n
\n