|
|
(3 intermediate revisions by 2 users not shown) |
Line 1: |
Line 1: |
| [http://en.wikipedia.org/wiki/Ajax_%28programming%29 Ajax]-driven or JavaScript-heavy sites often require | | #REDIRECT [[Capturing and Bubbling]] |
| different strategies than when scripting a regular site: elements appear, disappear and change at any time. This page contains some tips for scripting such sites.
| |
| | |
| == Catch bubbling events ==
| |
| | |
| This code will tell you what element you click, unless it or some ancestor element does <code>event.stopPropagation()</code>:
| |
| | |
| document.addEventListener('click',function(event) {
| |
| GM_log("Clicked " + event.target);
| |
| }, true);
| |
| | |
| This is useful since elements you want to attach listeners to might not be in the [[DOM]] yet when the page/script loads.
| |
| | |
| === Example scripts ===
| |
| * [http://userscripts.org/scripts/show/2419 Gmail attachment reminder]
| |
| | |
| | |
| == Listen for DOMNodeInserted event ==
| |
| | |
| This code is from Jesse Ruderman's [http://www.squarefree.com/userscripts/autolink.user.js?source Autolink] script:
| |
| | |
| var moddingDOM = false;
| |
|
| |
| window.addEventListener("load", init, false);
| |
| function init()
| |
| {
| |
| document.addEventListener("DOMNodeInserted", nodeInserted, false);
| |
| setTimeout(go, 50, document.body);
| |
| }
| |
|
| |
| // This makes it work at Gmail.
| |
| // 20% performance penalty on a plain text file with a link on almost every line.
| |
| // Tiny performance penalty on pages with few automatically added links.
| |
| function nodeInserted(e)
| |
| {
| |
| // our own modifications should not trigger this.
| |
| // (we don't want our regular expression objects getting confused)
| |
| // (we want better control over when we recurse)
| |
|
| |
| //GM_log("Inserted: " + e.target);
| |
|
| |
| if (!moddingDOM)
| |
| go(e.target);
| |
| }
| |
| | |
| === Example scripts ===
| |
| * [http://www.squarefree.com/userscripts/autolink.user.js?source Autolink]
| |
| | |
| | |
| {{stub}}
| |
| | |
| [[Category:Site-specific tips]]
| |