24 กันยายน 2551 ปักกิ่ง – วันนี้ อะโดบี (Nasdaq: ADBE) ได้ประกาศเปิดตัวผลิตภัณฑ์หลักสำคัญของอุตสาหกรรม นั่นคือ กลุ่มผลิตภัณฑ์ Adobe® Creative Suite® 4 ผลิตภัณฑ์นี้สามารถใช้ได้ในทุกขั้นตอนการทำงานเชิงสร้างสรรค์ และเป็นซอฟต์แวร์การออกแบบและพัฒนาชั้นนำของอุตสาหกรรม ด้วยความก้าวหน้าขั้นพื้นฐานในขั้นตอนการทำงาน อุปสรรคระหว่างนักออกแบบและนักพัฒนาจึงหมดไป กลุ่มผลิตภัณฑ์ Creative Suite 4 ใหม่ประกอบด้วยคุณสมบัติที่เป็นนวัตกรรมหลายร้อยรายการเพื่อพัฒนากระบวนการสร้างสรรค์ของการผลิตสิ่งพิมพ์ เว็บ อุปกรณ์เคลื่อนที่ การโต้ตอบ เสียงและวิดีโออย่างครอบคลุม ผลิตภัณฑ์นี้ยกระดับเทคโนโลยี Flash ของกลุ่มผลิตภัณฑ์ทั้งหมดไปสู่อีกระดับของการบูรณาการและการแสดงออก โดยเป็นซอฟต์แวร์เวอร์ชันที่ใหญ่ที่สุดของ Adobe รวมถึง Adobe Creative Suite 4 Design editions, Creative Suite 4 Web editions และ Creative Suite 4 Production Premium , Adobe Master Collection และผลิตภัณฑ์พื้นฐาน 13 รายการ เทคโนโลยีบูรณาการ 14 รายการ และบริการ 7 รายการ
ดังนั้นฉันจึงดาวน์โหลด DreamWeaver CS4 เวอร์ชันก่อนวางจำหน่ายอย่างเป็นทางการเพื่อทดสอบ ไม่มีอะไรจะพูดมากนักเกี่ยวกับการบีบอัดและการติดตั้ง ฉันแค่รู้สึกว่าความเร็วในการติดตั้งเร็วกว่า DreamWeaver CS3 รุ่นก่อนมาก หลังจากการติดตั้งเสร็จสิ้น ฉันพบว่า อินเทอร์เฟซดีขึ้นกว่าเดิม
นอกเหนือจากการเปลี่ยนแปลงอินเทอร์เฟซแล้ว เวอร์ชันนี้ยังถือเป็นเวอร์ชันหลักที่สำคัญและมีการอัปเดตมากมาย เช่น
เคล็ดลับโค้ดสำหรับเฟรมเวิร์ก Ajax และ JavaScript
การแก้ไข Adobe InContext
ชุดข้อมูล HTML
การบูรณาการการโค่นล้ม®
แนวทางปฏิบัติที่ดีที่สุดของ CSS ฯลฯ คุณสามารถตรวจสอบข้อมูลเพิ่มเติมได้ที่หน้าคุณสมบัติอย่างเป็นทางการ
ในที่นี้ผมจะแนะนำให้คุณรู้จักกับคุณสมบัติใหม่ๆ ของ JavaScript เป็นหลัก
1. ลิงก์ภายนอกโค้ด JavaScript
เรารู้ว่าเพื่อวัตถุประสงค์ต่างๆ โดยทั่วไปแล้วเราจะไม่เขียนโค้ด JavaScript บนหน้าเว็บโดยตรง แต่วางไว้ในไฟล์ js ภายนอก ประโยชน์ของการทำเช่นนี้ไม่เพียงแต่จะอำนวยความสะดวกในการจัดการ JavaScript บนทั้งไซต์เท่านั้น แต่ยังเพื่ออำนวยความสะดวกอีกด้วย ช่วยเหลือผู้คนได้มากมาย ด้วยความช่วยเหลือของการแคชไฟล์ js ของไคลเอนต์ การสูญเสียการรับส่งข้อมูลเครือข่ายของไฟล์ js ที่ไม่ค่อยมีการเปลี่ยนแปลงจะลดลง
นอกจากนี้ ด้วยเหตุผลต่างๆ เช่น การทำงานร่วมกันแบบหลายคนและการจัดการที่ง่ายดาย การเปลี่ยนแปลงแบบ Agile และการแบ่งชั้นโค้ด เราควรพยายามแยกโครงสร้าง-ประสิทธิภาพ-พฤติกรรมให้มากที่สุด ในการเขียนโค้ดปกติ คุณอาจใช้คำต่างๆ มากมาย เช่น
< a onclick="alert_me('นี่คือลิงก์')" href="#">คลิกเพื่อแจ้งเตือนฉัน</a>
อย่างไรก็ตาม โค้ดดังกล่าวทำได้โดยการเชื่อมโยงลักษณะการทำงานเข้ากับโครงสร้างโค้ดพื้นฐาน เราแนะนำให้เพิ่มเหตุการณ์เพื่อแยกโค้ดออกเป็นโค้ด JavaScript โดยสิ้นเชิง
ใน DreamWeaver CS4 ฟังก์ชันนี้มีไว้สำหรับเรา คุณสามารถค้นหาฟังก์ชันนี้ได้ใน [คำสั่ง]->[Externalize JavaScript]
เพื่อทดสอบคุณสมบัติทั้งสองนี้ เราได้เขียนโค้ดต่อไปนี้:
< !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(ผงชูรส)
-
การแจ้งเตือน (ข้อความ);
-
</สคริปต์>
</หัว>
<ร่างกาย>
<a href="#" onclick="alert_me('this is a link')">คลิกเพื่อแจ้งเตือนฉัน</a>
</ร่างกาย>
</html>
คุณจะเห็นว่าในโค้ดนี้ ไม่เพียงแต่ฟังก์ชัน JavaScript จะปรากฏบนเพจเท่านั้น แต่ลักษณะการทำงานยังเชื่อมโยงกับแท็ก HTML โดยตรงอีกด้วย ในขณะนี้ ให้ใช้ [Commands]->[Externalize JavaScript] เพื่อเปิด DreamWeaver CS4 เป็น ดังที่คุณเห็นจากเครื่องมือที่เรามีให้ มีสองตัวเลือก ซึ่งสอดคล้องกับการแยกเฉพาะบล็อกโค้ด JavaScript ในหน้าเว็บออกเป็นไฟล์ภายนอก และในเวลาเดียวกันก็แยก JavaScript ในโค้ด HTML:
เราเลือก "ทำให้ JavaScript ภายนอกและ แนบอย่างสงบเสงี่ยม " นั่นคือ การแยกบล็อคโค้ดและโค้ดในแท็กเสร็จสิ้นพร้อมกัน หลังจากดำเนินการคำสั่งเสร็จสิ้น โค้ดของเพจจะเป็นดังนี้:
< !DOCTYPE html PUBLIC "-//W3C/ /DTD XHTML 1.0 เฉพาะกาล//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>
</หัว>
<ร่างกาย>
<a href="#" id="a1">คลิกเพื่อแจ้งเตือนฉัน</a>
</ร่างกาย>
</html>
ด้วยวิธีนี้ งานที่เกี่ยวข้องจะเสร็จสมบูรณ์โดยอัตโนมัติ
2. เคล็ดลับโค้ด JavaScript
ไม่มี IDE ที่สะดวกเป็นพิเศษสำหรับการพัฒนา JavaScript มาโดยตลอด Aptana เป็นเครื่องมือพัฒนา JavaScript ที่ใช้ Ecplise ซึ่งมีฟังก์ชันการเน้นโค้ดและโค้ดพร้อมท์ ตอนนี้ DreamWeaver CS4 ยังมีฟังก์ชันนี้อีกด้วย เมื่อเราสร้างออบเจ็กต์ในตัว JavaScript พร้อมใช้งานสำหรับการบอกใบ้โค้ดแล้ว
นอกจากนี้ DreamWeaver CS4 ยังมีการแจ้งข้อผิดพลาดของโค้ดด้วย เมื่อเกิดข้อผิดพลาดในโค้ด จะมีแถบพร้อมท์สีเหลืองที่ด้านบนของหน้าต่างและหมายเลขบรรทัดทางด้านซ้ายของโค้ด
3. รองรับไลบรารี JavaScript บุคคลที่สาม
Aptana ที่กล่าวถึงข้างต้นยังให้การสนับสนุนไลบรารี JavaScript บุคคลที่สาม เช่น Prototype, jQuery, YUI, ExtJS เป็นต้น นอกจากนี้ DreamWeaver CS4 ยังให้การสนับสนุนไลบรารี Prototype ก่อน จากนั้นจึงป้อน Ajax ใหม่เมื่อลอง ในการสร้างแอปพลิเคชัน Ajax นั้น DreamWeave CS4 จะให้คำแนะนำโค้ดสำหรับวิธีสมาชิกของคลาส Ajax
แหล่งที่มาของบทความ: http://www.hanguofeng.cn/archives/web-client/dreamweaver-cs4-new-feture-javascript