2008 年 9 月 24 日、北京 - 本日、アドビ (ナスダック: ADBE) は、業界の画期的な製品である Adobe® Creative Suite® 4 製品ファミリーの発売を発表しました。この製品は、あらゆるクリエイティブなワークフローで使用でき、業界をリードする設計および開発ソフトウェアです。ワークフローの根本的な進歩により、デザイナーと開発者の間の障壁がなくなりました。新しい Creative Suite 4 製品ラインには、印刷、Web、モバイル、インタラクティブ、オーディオ、ビデオ制作のクリエイティブ プロセスを包括的に前進させるための数百の革新的な機能が含まれています。この製品は、製品ライン全体の Flash テクノロジーを新しいレベルの統合と表現に引き上げます。これには、Adobe Creative Suite 4 Design エディション、Creative Suite 4 Web エディション、および Creative Suite 4 Production Premium が含まれます。マスター コレクションと 13 の基本製品、14 の統合テクノロジー、および 7 つのサービス。
そこで、DreamWeaver CS4 の公式プレリリース版をダウンロードしてテストしました。解凍とインストールについては特に言うことはありませんが、インストールが完了すると、以前の DreamWeaver CS3 よりもインストール速度が大幅に速くなったことがわかりました。インターフェースが以前よりも改善されました。
インターフェイスの変更に加えて、このバージョンは重要なマイルストーン バージョンとして機能し、次のような多くの更新が行われています。
Ajax および JavaScript フレームワークのコード ヒント
Adobe InContext 編集
HTMLデータセット
Subversion® の統合
CSS のベスト プラクティスなど、詳細については公式の機能ページを確認してください。
ここではJavaScriptの新機能を中心に紹介します。
1. JavaScript コードの外部リンク。
さまざまな目的で、通常、JavaScript コードをページに直接記述せず、外部の js ファイルに配置することの利点は、サイト全体での JavaScript の管理が容易になるだけでなく、クライアントによる js ファイルのキャッシュにより、めったに変更されない js ファイルのネットワーク送信トラフィックの無駄が削減されます。
さらに、複数人でのコラボレーションや管理の容易さ、アジャイルな変更やコードの階層化などの理由から、構造-パフォーマンス-動作を可能な限り分離するように努めるべきです。通常のコード記述では、次のような言葉がたくさん使われることがあります。
< a onclick="alert_me('this is a link')" href="#">クリックして警告を受け取る</a>
ただし、このようなコードは、動作を基本的なコード構造に結合することで実現され、イベントを追加して JavaScript コードに完全に分離することを推奨します。この操作は DreamWeaver CS4 でも実行できます。
DreamWeaver CS4 では、この機能は [コマンド] -> [JavaScript の外部化] にあります。
これら 2 つの機能をテストするために、次のコードを作成しました。
< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD /xhtml1-transitional.dtd ">
<html xmlns=" http://www.w3.org/1999/xhtml ">
<頭>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無題のドキュメント</title>
<script type="text/javascript">
関数alert_me(msg)
{
アラート(メッセージ);
}
</script>
</head>
<本文>
<a href="#" onclick="alert_me('this is a link')">クリックして警告を受け取る</a>
</body>
</html>
このコードでは、JavaScript 関数がページ上に表示されるだけでなく、動作が HTML タグに直接バインドされていることがわかります。このとき、[コマンド]->[JavaScript を外部化]を使用して DreamWeaver CS4 を開きます。私たちが提供するツールからわかるように、ページ内の JavaScript コード ブロックのみを外部ファイルに分離することと、同時に HTML コード内の JavaScript を分離することにそれぞれ対応する 2 つのオプションがあります。ここでは、
「JavaScript を外部化し、 attach unobtrusively "、つまり、コードブロックとタグ内のコードの分離が同時に完了します。 コマンドの実行が完了すると、ページのコードは次のようになります。
< !DOCTYPE html PUBLIC "-//W3C/ /DTD XHTML 1.0 Transitional//EN" " http://www .w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns=" http://www.w3.org/1999/xhtml ">
<頭>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>無題のドキュメント</title>
<script src="SpryAssets/SpryDOMUtils.js" type="text/javascript"></script>
<script src="Untitled-15.js" type="text/javascript"></script>
</head>
<本文>
<a href="#" id="a1">クリックしてアラートを受け取る</a>
</body>
</html>
このようにして、対応する作業が自動的に完了します。
2. JavaScript コードのヒント。
Aptana は、JavaScript の開発に特に便利な IDE がありませんでした。Aptana は、コードのハイライト機能とコード プロンプト機能を提供する JavaScript 開発ツールです。JavaScript 組み込みオブジェクトを構築するときにも、この機能が提供されます。はすでにコードヒントで利用可能です。
さらに、DreamWeaver CS4 では、コード エラーに関するプロンプトも提供され、コード内でエラーが発生すると、ウィンドウの上部に黄色のプロンプト バーが表示され、コードの左側に行番号が表示されます。
3. サードパーティの JavaScript ライブラリのサポート。
上記の Aptana は、Prototype、jQuery、YUI、ExtJS などのさまざまな JavaScript サードパーティ ライブラリのサポートも提供します。DreamWeaver CS4 も最初に Prototype ライブラリを導入し、次に新しい Ajax を入力します。 Ajax アプリケーションを構築するために、DreamWeave CS4 は Ajax クラスのメンバー メソッドのコード ヒントを提供します。
記事のソース: http://www.hanguofeng.cn/archives/web-client/dreamweaver-cs4-new-feture-javascript