24. September 2008, Peking – Heute gab Adobe (Nasdaq: ADBE) die Einführung eines Meilensteinprodukts der Branche bekannt – der Produktfamilie Adobe® Creative Suite® 4. Das Produkt kann in allen kreativen Arbeitsabläufen eingesetzt werden und ist die branchenführende Design- und Entwicklungssoftware. Durch einen grundlegenden Durchbruch im Workflow werden die Barrieren zwischen Designern und Entwicklern beseitigt. Die neue Produktlinie Creative Suite 4 umfasst Hunderte innovativer Funktionen, um den kreativen Prozess der Print-, Web-, mobilen, interaktiven, Audio- und Videoproduktion umfassend voranzutreiben. Dieses Produkt hebt die Flash-Technologie der gesamten Produktlinie auf ein neues Integrations- und Ausdrucksniveau. Es ist die bislang größte Softwareversion von Adobe, einschließlich der Adobe Creative Suite 4 Design Editions, der Creative Suite 4 Web Editions und der Creative Suite 4 Production Premium Master Collection und 13 Basisprodukte, 14 integrierte Technologien und 7 Services.
Also habe ich die offizielle PreRelease-Version von DreamWeaver CS4 zum Testen heruntergeladen. Zur Dekomprimierung und Installation gibt es nur das Gefühl, dass die Installationsgeschwindigkeit viel schneller ist als bei der früheren Version von DreamWeaver CS3 Die Benutzeroberfläche ist aufgrund bestimmter Änderungen besser.
Neben Schnittstellenänderungen dient diese Version als wichtige Meilensteinversion und verfügt über viele Updates, wie zum Beispiel:
Codetipps für Ajax- und JavaScript-Frameworks
Adobe InContext-Bearbeitung
HTML-Datensatz
Subversion®-Integration
Weitere Informationen zu CSS-Best Practices usw. finden Sie auf der offiziellen Funktionsseite.
Hier werde ich Ihnen hauptsächlich einige neue Funktionen von JavaScript vorstellen.
1. Externe Links zum JavaScript-Code.
Wir wissen, dass wir für verschiedene Zwecke im Allgemeinen JavaScript-Code nicht direkt auf die Seite schreiben, sondern ihn in einer externen js-Datei platzieren. Der Vorteil dieser Vorgehensweise besteht nicht nur darin, die Verwaltung von JavaScript auf der gesamten Website zu erleichtern, sondern auch darin, Mit Hilfe des Client-Cachings von JS-Dateien wird die Verschwendung des Netzwerkübertragungsverkehrs von JS-Dateien, die sich selten ändern, reduziert.
Darüber hinaus sollten wir aus Gründen wie der Zusammenarbeit mehrerer Personen und der einfachen Verwaltung, agilen Änderungen und Codeschichtung versuchen, Struktur, Leistung und Verhalten so weit wie möglich zu trennen. Beim normalen Schreiben von Code verwenden Sie möglicherweise viele Wörter wie
< a onclick="alert_me('this is a link')" href="#">Klicken Sie, um mich zu benachrichtigen</a>
Dies geschieht jedoch durch die Einbindung des Verhaltens in die grundlegende Codestruktur. Wir empfehlen das Hinzufügen von Ereignissen, um es vollständig in JavaScript-Code zu trennen. Dieser Vorgang kann auch von DreamWeaver CS4 durchgeführt werden.
In DreamWeaver CS4 steht uns diese Funktion zur Verfügung. Sie finden diese Funktion unter [Befehle] -> [JavaScript externisieren].
Um diese beiden Funktionen zu testen, haben wir den folgenden Code geschrieben:
< !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 ">
<Kopf>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
<script type="text/javascript">
Funktion alarm_me(msg)
{
Warnung(Nachricht);
}
</script>
</head>
<Körper>
<a href="#" onclick="alert_me('this is a link')">Klicken Sie, um mich zu benachrichtigen</a>
</body>
</html>
Sie können sehen, dass in diesem Code nicht nur die JavaScript-Funktion auf der Seite angezeigt wird, sondern das Verhalten auch direkt an das HTML-Tag gebunden ist. Verwenden Sie zu diesem Zeitpunkt [Befehle] -> [JavaScript externisieren], um DreamWeaver CS4 zu öffnen Wie Sie den von uns bereitgestellten Tools entnehmen können, gibt es zwei Möglichkeiten, die jeweils der Trennung nur der JavaScript-Codeblöcke in der Seite in externe Dateien und gleichzeitig der Trennung des JavaScript im HTML-Code entsprechen:
Wir wählen „JavaScript externalisieren und“. unauffällig anhängen“, das heißt, die Trennung von Codeblöcken und Codes in Tags wird gleichzeitig abgeschlossen. Nach Abschluss der Befehlsausführung lautet der Code der Seite wie folgt:
< !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 ">
<Kopf>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
<script src="SpryAssets/SpryDOMUtils.js" type="text/javascript"></script>
<script src="Untitled-15.js" type="text/javascript"></script>
</head>
<Körper>
<a href="#" id="a1">Klicken Sie, um mich zu benachrichtigen</a>
</body>
</html>
Auf diese Weise werden die entsprechenden Arbeiten automatisch erledigt.
2. Tipps zum JavaScript-Code.
Es gab schon immer keine besonders praktische IDE für die Entwicklung von JavaScript. Aptana ist ein auf Ecplise basierendes JavaScript-Entwicklungstool, das Funktionen zur Code-Hervorhebung und Code-Eingabeaufforderung bietet ist bereits für Code-Hinweise verfügbar.
Darüber hinaus bietet DreamWeaver CS4 auch Eingabeaufforderungen für Codefehler. Wenn im Code ein Fehler auftritt, wird oben im Fenster eine gelbe Eingabeaufforderungsleiste und auf der linken Seite des Codes die Zeilennummer angezeigt.
3. Unterstützung für JavaScript-Bibliotheken von Drittanbietern.
Das oben erwähnte Aptana bietet auch Unterstützung für eine Vielzahl von JavaScript-Bibliotheken von Drittanbietern wie Prototype, jQuery, YUI, ExtJS usw. DreamWeaver CS4 bietet auch Unterstützung. Zuerst führen wir eine Prototype-Bibliothek ein und geben dann beim Ausprobieren neue Ajax ein Um eine Ajax-Anwendung zu erstellen, stellt DreamWeave CS4 Codehinweise für Methoden der Ajax-Klassenmitglieder bereit.
Artikelquelle: http://www.hanguofeng.cn/archives/web-client/dreamweaver-cs4-new-feture-javascript