OLD | NEW |
1 <h1>Content Scripts</h1> | 1 <h1>Content Scripts</h1> |
2 | 2 |
3 | 3 |
4 <p> | 4 <p> |
5 Content scripts are JavaScript files that run in the context of web pages. | 5 Content scripts are JavaScript files that run in the context of web pages. |
6 By using the standard | 6 By using the standard |
7 <a href="http://www.w3.org/TR/DOM-Level-2-HTML/">Document | 7 <a href="http://www.w3.org/TR/DOM-Level-2-HTML/">Document |
8 Object Model</a> (DOM), | 8 Object Model</a> (DOM), |
9 they can read details of the web pages the browser visits, | 9 they can read details of the web pages the browser visits, |
10 or make changes to them. | 10 or make changes to them. |
(...skipping 437 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
448 <pre> | 448 <pre> |
449 <em>//Code for displaying <extensionDir>/images/myimage.png:</em> | 449 <em>//Code for displaying <extensionDir>/images/myimage.png:</em> |
450 var imgURL = <b>chrome.extension.getURL("images/myimage.png")</b>; | 450 var imgURL = <b>chrome.extension.getURL("images/myimage.png")</b>; |
451 document.getElementById("someImage").src = imgURL; | 451 document.getElementById("someImage").src = imgURL; |
452 </pre> | 452 </pre> |
453 | 453 |
454 <h2 id="examples"> Examples </h2> | 454 <h2 id="examples"> Examples </h2> |
455 | 455 |
456 <p> | 456 <p> |
457 You can find many | 457 You can find many |
458 <a href="samples#script">examples that use content scripts</a>. | 458 <a href="samples#search:script">examples that use content scripts</a>. |
459 A simple example of communication via messages is in the | 459 A simple example of communication via messages is in the |
460 <a href="samples#message-timer">Message Timer</a>. | 460 <a href="samples#message-timer">Message Timer</a>. |
461 See <a href="samples#page-redder">Page Redder</a> and | 461 See <a href="samples#page-redder">Page Redder</a> and |
462 <a href="samples#email-this-page-(by-google)">Email This Page</a> | 462 <a href="samples#email-this-page-(by-google)">Email This Page</a> |
463 for examples of programmatic injection. | 463 for examples of programmatic injection. |
464 </p> | 464 </p> |
465 | 465 |
466 | 466 |
467 <h2 id="videos"> Videos </h2> | 467 <h2 id="videos"> Videos </h2> |
468 | 468 |
469 <p> | 469 <p> |
470 The following videos discuss concepts that are important for content scripts. | 470 The following videos discuss concepts that are important for content scripts. |
471 The first video describes content scripts and isolated worlds. | 471 The first video describes content scripts and isolated worlds. |
472 </p> | 472 </p> |
473 | 473 |
474 <div class="video-container"> | 474 <div class="video-container"> |
475 <iframe title="YouTube video player" width="640" height="390" src="//www.youtu
be.com/embed/laLudeUmXHM?rel=0" frameborder="0" allowfullscreen></iframe> | 475 <iframe title="YouTube video player" width="640" height="390" src="//www.youtu
be.com/embed/laLudeUmXHM?rel=0" frameborder="0" allowfullscreen></iframe> |
476 </div> | 476 </div> |
477 | 477 |
478 <p> | 478 <p> |
479 The next video describes message passing, | 479 The next video describes message passing, |
480 featuring an example of a content script | 480 featuring an example of a content script |
481 sending a request to its parent extension. | 481 sending a request to its parent extension. |
482 </p> | 482 </p> |
483 | 483 |
484 <div class="video-container"> | 484 <div class="video-container"> |
485 <iframe title="YouTube video player" width="640" height="390" src="//www.youtu
be.com/embed/B4M_a7xejYI?rel=0" frameborder="0" allowfullscreen></iframe> | 485 <iframe title="YouTube video player" width="640" height="390" src="//www.youtu
be.com/embed/B4M_a7xejYI?rel=0" frameborder="0" allowfullscreen></iframe> |
486 </div> | 486 </div> |
OLD | NEW |