Dreamweaver MX新增了一个Snippets(代码片段)面板。有了它,代码的重用就变得容易多了。如果该面板没有打开,选择Window>Snippets,可以打开Snippets面板。它位于Code面板组中,如下图所示。
在Snippets面板里可以存储HTML、JavaScript、CFML、ASP、JSP代码,这样你就可以很方便地重用这些代码。
1.用Snippets面板插入代码片段
如果要让插入的代码包围(wrap around)选定对象,就要先在文档中作出选择。然后,在Snippets面板双击选定的代码片段;或在选定的代码片段上右击,再从弹出的菜单上选Insert(插入)命令。
例如,我们可以在Snippets面板选择Comments>CommentSplitWrap.csn,对文档窗口中选定的文本进行注释,如下图所示。
此时,如果你打开代码窗口,你就可以看到如下的代码:
这些代码以暗色和斜体显示,包围着我们选定的对象。到这里,相信你对E文“Wrap around a selection”的理解不会存在什么问题了吧。
使用Dreamweaver MX预先存储的代码片段,可以快速创建一些页面元素。例如,我们需要在页面创建一个年份选择的下拉菜单,可以选择插入Snippets面板中的Form Elements>Dropdown Menus>Year_1900to2002.csn。操作方法是:在文档中定位插入点,然后在Snippets面板中双击Year_1900to2002.csn,或直接拖拽它到文档中,如下图所示。
打开代码窗口,你可以看到插入了下面的HTML代码:
<select name="YYYY">
<option value="2002">2002</option>
<option value="2001">2001</option>
……
中间部分省略
……
<option value="1901">1901</option>
<option value="1900">1900</option>
</select>
在浏览器中预览,你就可以在下拉菜单中选择1900-2002之间的任一年份,是不是很方便?