Work with code snippets – Adobe Dreamweaver CC 2014 v.13 User Manual
Page 480
attach the JavaScript associated with those handlers to your document.
You should be aware of the following limitations of the JavaScript Extractor before using it:
The JSE does not extract script tags in the body of the document (except in the case of Spry widgets). There is a chance that externalizing
these scripts could cause unexpected results. By default, Dreamweaver lists these scripts in the Externalize JavaScript dialog box, but does
not select them for extraction. (You can manually select them if you want.)
The JSE does not extract JavaScript from editable regions of .dwt (Dreamweaver template) files, non-editable regions of template instances,
or Dreamweaver Library items.
After you extract JavaScript using the Externalize JavaScript and Attach Unobtrusively option, you can no longer edit Dreamweaver
behaviors in the Behaviors panel. Dreamweaver cannot inspect and populate the Behaviors panel with behaviors that it has attached
unobtrusively.
You cannot undo your changes once you close the page. You can, however, undo changes as long as you remain in the same editing
session. Select Edit > Undo Externalize JavaScript to undo.
Some very complex pages might not work as expected. Use care when extracting JavaScript from pages with document.write() in the body
and global variables.
For a video overview from the Dreamweaver engineering team about JavaScript support in Dreamweaver, see
To use the JavaScript Extractor:
1. Open a page that contains JavaScript (for example, a Spry page).
2. Select Commands > Externalize JavaScript.
3. In the Externalize JavaScript dialog box, edit the default selections if necessary.
Select Only Externalize JavaScript if you want Dreamweaver to move any JavaScript to an external file, and to reference that file in the
current document. This option leaves event handlers such as onclick and onload in the document, and leaves Behaviors visible in the
Behaviors panel.
Select Externalize JavaScript and Attach Unobtrusively if you want Dreamweaver to 1) move JavaScript to an external file and reference
it in the current document, and 2) remove event handlers from the HTML and insert them at runtime using JavaScript. When you select
this option, you can no longer edit Behaviors in the Behaviors panel.
In the Edit column, deselect any edits you do not want to make, or select edits that Dreamweaver did not select by default.
By default, Dreamweaver lists but does not select the following edits:
Script blocks in the head of the document that contain document.write() or document.writeln() calls.
Script blocks in the head of the document that contain function signatures related to EOLAS handling code, which is known to use
document.write().
Script blocks in the body of the document, unless the blocks contain only Spry widget or Spry data set constructors.
Dreamweaver automatically assigns IDs to elements that don’t already have IDs. If you don’t like these IDs, you can change them by
editing the ID text boxes.
4. Click OK.
The summary dialog provides a summary of extractions. Review the extractions and click OK.
5. Save the page.
Dreamweaver creates a SpryDOMUtils.js file, as well as another file that contains the extracted JavaScript. Dreamweaver saves the
SpryDOMUtils.js file in a SpryAssets folder in your site, and saves the other file at the same level as the page from which you extracted the
JavaScript. Don’t forget to upload both of these dependent files to your web server when you upload the original page.
Work with code snippets
Code snippets let you store content for quick reuse. You can create, insert, edit, or delete snippets of HTML, JavaScript, CFML, ASP, PHP, and
more. You can also manage and share your code snippets with team members. Some predefined snippets that you can use as a starting point are
available.
Snippets that contain <font> tags and other deprecated elements and attributes are in the Legacy folder in the Snippets panel.
Insert a code snippet
1. Place the insertion point where you want to insert the code snippet, or select code to wrap a snippet around.
2. In the Snippets panel (Window > Snippets), double-click the snippet.
You can also right-click (Windows) or Control-click (Macintosh) the snippet, and then select Insert from the pop-up menu.
473