Convert Html To Javascript

สวัสดีอีกครั้งครับ ก็ถึงปีใหม่แล้ว ก็มีบทความใหม่มาอันหนึ่ง
คือการเขียน html ในรูป javascript ซึ่งจะช่วยย่นระยะเวลาและสะดวกในการแก้ไขเว็บ
ซึ่งการเขียน html ในรูปแบบภาษา javascript จะทำให้ เราแก้ไฟล์ html หลายไฟล์ได้
โดยแก้ไขที่ ไฟล์ js เพียงไฟล์เดียว



ในตอนแรกผมไม่กล่าวถึง การสร้างไฟล์ js ในทันที แต่ ผมจะเริ่มอธิบายตั้งแต่พื้นฐาน การเขียน javascript ในไฟล์ html ก่อน
การเขียน javascript ในไฟล์ html จะเขียนได้หลายตำแหน่ง ทั้งภายในแท็ก head หรือแท็ก body

<html>
<head><title> page title <title>

<SCRIPT  TYPE="TEXT/JAVASCRIPT"  LANGUAGE="JAVASCRIPT">
<!--
document.write ( 'Text into tag head ' );
//-->
</SCRIPT>

</head>

<body bgcolor=white>

<SCRIPT  TYPE="TEXT/JAVASCRIPT"  LANGUAGE="JAVASCRIPT">
<!--
document.write ( 'Text into tag body ' );
//-->
</SCRIPT>

สวัสดีครับ

<SCRIPT  TYPE="TEXT/JAVASCRIPT"  LANGUAGE="JAVASCRIPT">
<!--
document.write ( ' Text into tag body again ' );
//-->
</SCRIPT>

</body>

</html>

จะได้ผลเป็น
test.htm -  Microsoft Internet Explorer
 
Text into tag head Text into tag body สวัสดีครับ Text into tag body again

นอกจากการเขียน javascript ไว้ ใน html ตามลักษณะด้านบน
มีอีกวิธีหนึ่งที่จะใช้คำสั่ง javascript ได้ โดยสร้างไฟล์ js ขึ้นมาก่อน
หลังจากนั้นเขียน แท็กเพื่อเชื่อมเอาคำสั่งจากไฟล์ js ลงในไฟล์ html
การสร้างไฟล์ js มีวิธีสร้าง แบบเดียวกับการสร้างไฟล์ html
คือการพิมพ์ตัวอักษรลงบน notepad หรือ text editor
แต่ให้ save นามสกุลเป็น (*.js)   เช่น menulink.js หรือ indexlink.js

ตัวอย่าง source code ของ ไฟล์ js (สมมุติชื่อว่า thank.js )
document.write( 'this is a text form js file Thank you very much' )

ให้สังเกตว่าไม่ได้เขียน <script> </script>
เมื่อต้องการใช้ ก็เชื่อมโยงมาโดยใช้แท็ก ดังนี้

<html>
<head><title> page title <title>
</head>

<body bgcolor=white>

<script  type="text/javascript"  language="javascript"  src="thank.js"></script>

สวัสดีครับ

<script  type="text/javascript"  language="javascript"  src="thank.js"></script>

</body>

</html>

จะได้ผลเป็น
test.htm -  Microsoft Internet Explorer
 
this is a text form js file Thank you very much สวัสดีครับ this is text form js file Thank you very much



เมื่อเราสร้างไฟล์ js ขึ้นมา เราก็สามารถนำมันเป็นไปเชื่อมโยงต่อไปยัง ไฟล์ html หน้าอื่นๆ ได้มากมาย
จากนั้นเมื่อต้องการแก้ไข ก็แก้ไขที่ ไฟล์ js นั้นเพียงไฟล์เดียว ก็จะมีผลเปลี่ยนแปลงไปยังทุกหน้าที่ ทำแท็กเชื่อมโยงไว้


เอาล่ะครับวันนี้ผมยังทำไม่เสร็จ
ขอเวลาอีกสักพักจะอธิบายให้ละเอียดขึ้นกว่านี้ครับ

ถ้าอยากจะเห็นตัวอย่าง ของการใช้ไฟล์ js ร่วมเพื่อความเร็วในการแก้ไขเว็บ
ลองไปเยี่ยมชมอีกเว็บหนึ่งที่ผมทำไว้นะครับ
หาก เปิดดู source code จะเห็นว่ามี การเขียนแท็ก script js ในทุกๆ หน้า
ข้างในไฟล์ js นั้นผมเขียน คำสั่ง document.write() ไว้
ซึ่งเวลาผมเพิ่มลิงค์ เพียงแค่แก้ที่ไฟล์ all1.js ก็จะทำให้
ลิงค์ในทุกๆ หน้าถูกแก้ไขตามไปด้วย ซึ่งตามปกติถ้าใช้ html เขียนอย่างเดียว
จะต้องแก้ทุกๆ หน้า อย่างเว็บ simpletown ก็แก้ทั้งหมด 10 กว่าหน้าน่ะครับ