Chromium Code Reviews Chromium Code Reviews
Issue 10832110:
Docs: Clarifying the CSP-friendly replacement for <body onload="XXX">. (Closed)
Base URL: svn://svn.chromium.org/chrome/trunk/src| Index: chrome/common/extensions/docs/static/contentSecurityPolicy.html |
| diff --git a/chrome/common/extensions/docs/static/contentSecurityPolicy.html b/chrome/common/extensions/docs/static/contentSecurityPolicy.html |
| index 69e95c8a366c1a94fba9c93967d076d01a5088f3..3234ff022bca0471d8c34397893ad75bbfa1ea5f 100644 |
| --- a/chrome/common/extensions/docs/static/contentSecurityPolicy.html |
| +++ b/chrome/common/extensions/docs/static/contentSecurityPolicy.html |
| @@ -93,9 +93,13 @@ |
| function clickHandler(element) { |
| setTimeout(<strong>"awesome(); totallyAwesome()"</strong>, 1000); |
| } |
| + |
| + function main() { |
| + // Initialization work goes here. |
| + } |
| </script> |
| </head> |
| - <body> |
| + <body onload="main();"> |
| <button <strong>onclick="clickHandler(this)"</strong>> |
| Click for awesomeness! |
| </button> |
| @@ -113,8 +117,13 @@ |
| JavaScript file (<code>popup.js</code> would be a good target). |
| </li> |
| <li> |
| - The inline event handler definition must be rewritten in terms of |
| - <code>addEventListener</code> and extracted into <code>popup.js</code>. |
| + <p>The inline event handler definitions must be rewritten in terms of |
|
Aaron Boodman
2012/08/10 19:21:11
Another easy thing to do is just include the scrip
|
| + <code>addEventListener</code> and extracted into <code>popup.js</code>.</p> |
| + <p>If you're currently kicking off your program's execution via code like |
| + <code><body onload="main();"></code>, consider replacing it by hooking |
| + into the document's <code>DOMContentLoaded</code> event, or the window's |
| + <code>load</code> event, depending on your needs. Below we'll use the |
| + former, as it generally triggers more quickly.</p> |
| </li> |
| <li> |
| The <code>setTimeout</code> call will need to be rewritten to avoid |
| @@ -138,25 +147,28 @@ function totallyAwesome() { |
| // do something TOTALLY awesome! |
| } |
| -<strong> |
| -function awesomeTask() { |
| +<strong>function awesomeTask() { |
| awesome(); |
| totallyAwesome(); |
| -} |
| -</strong> |
| +}</strong> |
| function clickHandler(e) { |
| setTimeout(<strong>awesomeTask</strong>, 1000); |
| } |
| +function main() { |
| + // Initialization work goes here. |
| +} |
| + |
| // Add event listeners once the DOM has fully loaded by listening for the |
| // `DOMContentLoaded` event on the document, and adding your listeners to |
| // specific elements when it triggers. |
| -document.addEventListener('DOMContentLoaded', function () { |
| +<strong>document.addEventListener('DOMContentLoaded', function () {</strong> |
| document.querySelector('button').addEventListener('click', clickHandler); |
| + main(); |
| }); |
| - |
| -popup.html: |
| +</pre> |
| +<pre>popup.html: |
| =========== |
| <!doctype html> |
