การเขียนโปรแกรมเพื่ออ่าน
Source Code ที่ซ่อนอยู่ของ JAVA Script
ตัวอย่าง
การเขียนโปรแกรมแสดงผลปฏิทิน
โดยที่ปฏิทินจะปรากฏอยู่ที่หน้าจอของบราวเซอร์
แต่เมื่อดูโครงสร้างจะไม่พบโปรแกรมที่เป็น HTML
เนื่องจากเขียนเป็นซอสโค้ดซ่อนเอาไว้ที่ไฟล์ชื่อ
Calendar.js โดย
<html>
<head>
<title>การเขียนโปรแกรมจาวาสคริปต์แสดงโปรแกรมปฏิทิน</title>
<script src=calendar.js>
</script>
</head>
<body>
โปรแกรมปฏิทิน
</body>
</html>
จากโปรแกรมเมื่อนำไปอ่านที่
browser จะไม่สามารถทำงานได้ จะต้องประกอบด้วยไฟล์ที่ชื่อ
calendar.js
ซึ่งเป็นไฟล์ที่เขียนโปรแกรมปฏิทินเอาไว้ดังนี้
โปรแกรมไฟล์ Calendar.js
( เขียนด้วย Notepad
จัดเก็บโฟลเดอร์เดียวกับ java60.html )
function montharr(m0, m1, m2, m3, m4,
m5, m6, m7, m8, m9, m10, m11) {
this[0] = m0;
this[1] = m1;
this[2] = m2;
this[3] = m3;
this[4] = m4;
this[5] = m5;
this[6] = m6;
this[7] = m7;
this[8] = m8;
this[9] = m9;
this[10] = m10;
this[11] = m11;
}
function calendar( ) {
var months=new
Array(มกราคม,กุมภาพันธ์,มีนาคม,เมษายน,พฤษภาคม,มิถุนายน,
กรกฎาคม,สิงหาคม,กันยายน,ตุลาคม,พฤศจิกายน,ธันวาคม);
var nYear=new Array(ชวด, ฉลู,
ขาล, เถอะ, มะโรง, มะเส็ง, มะเมีย, มะแม, วอก, ระกา,
จอ, กุน);
var tMonth=new Array(อ้าย, ยี่,
สาม, สี่, ห้า, หก, เจ็ด, แปด, เก้า, สิบ, สิบเอ็ด,
สิบสอง);
var dName=new Array(จันทร์,
อังคาร, พุธ, พฤหัสฯ, ศุกร์, เสาร์, อาทิตย์);
var today=new Date( );
var thisDay;
var monthDays=new montharr(31, 28, 31,
30, 31, 30, 31, 31, 30, 31, 30, 31);
var thisMonth=months[today.getMonth(
)];
var dayName=dName[today.getDay( )];
year=543+today.getYear( )+0;
yName=nYear[year%10];
mthaiMth=tMonth[today.getMonth( )+1];
thisDay=today.getDate( );
if(((year%4==0)&&(year%100!=0))||(year%400==0))
monthDays[1]=29;
nDays=monthDays[today.getMonth( )];
firstDay=today;
firstDay.setDate(1);
testMe=firstDay.getDate( );
if(testMe == 2)
firstDay.setDate(0);
startDay=
firstDay.getDay( );
document.write(<TABLE BORDER=1
BGCOLOR=#F1F1F1 WIDTH=140>);
document.write(<TR BGCOLOR=#FF9900><TH
COLSPAN=7>);
//document.write(<IMG
SRC=+mImgDir+mImage+BORDER=0></TH></TR>);
document.write(<FONT FACE=MS SANS
SERIF COLOR=#FFFFFF>+thisMonth+
</FONT></TH></TR>);
document.write(<TR><TD CLASS+thaifont
COLSPAN=7 ALIGN=CENTER><FONT
COLOR=#FF0000 SIZE=2>);
document.write(เดือน+mthaiMth+ปี+yName+ +year);
document.write(</FONT></TD></TR>);
document.write(<TR>);
document.write(<TD CLASS=thaifont
BGCOLOR=#FF0000><FONT SIZE=1 COLOR=#
FFFFFF>อา</FONT></TD>);
document.write(<TD CLASS=thaifont
BGCOLOR=#FFFF00><FONT SIZE=1 COLOR=#
000000>จ.</FONT></TD>);
document.write(<TD CLASS=thaifont
BGCOLOR=#FF0099><FONT SIZE=1 COLOR=#FFFFFF>อ.</FONT></TD>);
document.write(<TD CLASS=thaifont
BGCOLOR=#99FF66><FONT SIZE=1 COLOR=#000000>พ.</FONT></TD>);
document.write(<TD CLASS=thaifont
BGCOLOR=#FF9999><FONT SIZE=1 COLOR=#FFFFFF>พฤ</FONT></TD>);
document.write(<TD CLASS=thaifont
BGCOLOR=#99CCFF><FONT SIZE=1 COLOR=#000000>ศ.</FONT></TD>);
document.write(<TD CLASS=thaifont
BGCOLOR=#CC99FF><FONT SIZE=1 COLOR=#FFFFFF>ส.</FONT></TD>);
document.write(</TR>);
document.write(<TR>);
column=0;
for(i=0;<startDay;i++) {
document.write(<TD><TD>);
column++;
}
for(i=1;i<=nDays;i++) {
document.write(<TD ALIGN=RIGHT><FONT
SIZE=1>);
if (i==thisDay)
document.write(<FONT
COLOR=RED><B>);
document.write(i);
document.write(</B></FONT>);
column++;
if (column==7) {
document.write(</TD></TR><TR>);
column=0;
}
}
document.write(</TABLE>);
}
calendar( );
document.write( );
เทคนิคการทำให้ตัวอักษรไล่ตามเม้าส์
ตัวอย่าง
การเขียนโปรแกรมการทำให้ตัวอักษรไล่ตามเม้าส์ เมื่อเลื่อนเม้าส์ไปตำแหน่งใดก็ตามหน้า เว็บเพจก็จะเกิดตัวอักษรวิ่งไล่ตาม
ส่วนที่ 1 : ใส่ระหว่าง <head></head>
ดังนี้
<HEAD>
<title>การเขียนโปรแกรมเพื่อให้เกิดข้อความวิ่งตามเม้าส์</title>
<style>.spanstyle {
COLOR:white;FONT-FAMILY:Verdana;FONT-SIZE:8pt;FONT-WEIGHT:bold;
POSITION:absolute;TOP:-50px;VISIBILITY:visible
}
</style>
<SCRIPT LANGUAGE=JavaScript>
<!- -Begin
var x,y;
var step=10;
var flag=0;
var message=ไปไหนไปด้วย Love me Love my mouse;
message=message.split( );
var xpos=new Array( );
for (i=0;i<=message.length-1;i++) {
xpos[i]=-50;
}
var ypos=new Array( );
for (i=0;i<=message.length-1;i++) {
ypos[i]=-50;
}
function handlerMM(e) {
x=(document.layers)?e.pageX:document.body.scrollLeft+event.clientX;
y=(document.layers)?e.pageY:document.body.scrollTop+event.clientY;
flag=1;
}
function makesnake( ) {
if (flag==1&&document.all) {
for (i=message.length-1;i>=1;i- -) {
xpos[i]=xpos[i-1]+step;
ypos[i]=ypos[i-1];
}
xpos[0]=x+step;
ypos[0]=y;
for (i=0;i<message.length-1;i++) {
var thisspan=eval("span"+(i)+".style");
thisspan.posLeft=xpos[i];
thisspan.posTop=ypos[i];
}
}
else if (flag==1 && document.layers) {
for (i=message.length-1;i>=1;i- -) {
xpos[i]=xpos[i-1]+step;
ypos[i]=ypos[i-1];
}
xpos[0]=x+step;
ypos[0]=y;
for (i=0;i<message.length-1;i++) {
var thisspan=eval("document.span"+i);
thisspan.left=xpos[i];
thisspan.top=ypos[i];
}
}
var timer=setTimeout("makesnake( )",10);
}
</script>
</HEAD>
ส่วนที่ 2 ใส่ต่อจาก <head> </head>
ก่อนเข้าสู่ <body>
<body bgcolor=#000080text=#000000onload=makesnake(
)style=OVERFLOW- X:hidden;OVERFLOW- Y:scroll;WIDTH:100%>
ส่วนที่ 3
ใส่ระหว่าง <body> </body>
<body>
<SCRIPT LANGUGE="JavaScript">
<!- - Begin
for (i=0;i<=message.length-1;i++) {
document.write("<span
id='span"+i+"'class='spanstyle'>");
document.write(message[i]);
document.write("</span>");
}
if (document.layers) {
document.captureEvents(Event.MOUSEMOVE);
}
document.onmousemove=handlerMM;
</script>
</body>
</html>
<!-
-มีข้อสงสัยสอบถามมาได้ที่ /downloadnow_info@yahoo.com/ tel.530-3785- ->
การเขียนโปรแกรมเกี่ยวกับเวลา
การเขียนโปรแกรมทำงานเกี่ยวข้องกับระบบนาฬิกาของเครื่อง
โปรแกรมจะตรวจสอบเวลาและมีจังหวะการทำงานตามระบบเวลาของเครื่องคอมพิวเตอร์แต่ละเครื่อง
ตัวอย่าง
การเขียนโปรแกรมการทำให้เกี่ยวกับเวลา
เป็นโปรแกรมนับเวลาในเว็บเป็นวินาทีโดยจะมีปุ่มกดให้ 3 ปุ่ม คือ
ปุ่มเริ่ม ปุ่มหยุด และปุ่มรีเซ็ตหรือเริ่มต้นใหม่
เมื่อเขียนโปรแกรมเสร็จ
<html>
<head>
<title>การเขียนจาวาสคริปต์เพื่อการนับเวลาเข้าสู่เว็บ
โดยมีปุ่มกด </title>
<script language=JavaScript>
<!- -
//please keep these lines
on when you copy the source
//made by:Nicolas
http://www.javascript-page.com
var timerID=0;
var tStart=null;
function UpdateTimer( )
{
if(timerID) {
clearTimeout(timerID);
clockID=0;
}
if(!tStart)
tStart=new Date( );
var tDate=new Date( );
var tDiff=tDate.getTime( )-tStart.getTime( );
tDate.setTime(tDiff);
document.theTimer.theTime.value=
+tDate.getMinutes( )+:
+tDate.getSeconds( )+:
timerID=setTimeout(UpdateTimer( ),1000);
}
function Start( )
{
tStart=new Date( );
document.theTimer.theTime.value=00:00;
timerID=setTimeout(UpdateTimer( ),1000);
}
function Stop( )
{
if(timerID) {
clearTimeout(timerID);
timerID=0;
}
tStart=null;
}
function Reset( )
{
tStart=null;
document.theTimer.theTime.value=00:00;
}
//- ->
</script>
<body onload=Reset( ) onunload=Stop( )>
<center><form name=theTimer><table>
<tr>
<td colspan=3align=center>
<input type=text name=theTime
size=5>
</td>
</tr>
<tr><td></td></tr>
<tr>
<td>
<input type=button name=start value=Start
onclick=Start( )>
</td>
<td>
<input type=button name=stop value=Stop
onclick=Stop( )>
</td>
<td>
<input type=button name=reset value=Reset
onclick=Reset( )>
</td>
</tr>
</table></form></center>
</head>
</html>
ตัวอย่าง
การเขียนโปรแกรมแสดงเวลาที่เริ่มเข้าสู่เว็บไซต์
โดยโปรแกรมจะนับเวลาตั้งแต่เริ่มเข้าสู่ เว็บเจนั้นตามเวลาจริงของเครื่องคอมพิวเตอร์
เมื่อเขียนโปรแกรมเสร็จ
<html>
<head>
<title>การเขียนจาวาสคริปต์เพื่อแสดงเวลาเริ่มต้นเข้าสู่เว็บ
ตามนาฬิกาในคอมพิวเตอร์</title>
<center>
<script language=JavaScript>
<!- -
//please keep these lines on when you copy the source
//made by:Nicolas
http://www.javascript-page.com
today=new Date( )
document.write(เวลาที่คุณเริ่มเข้าสู่เว็บไซต์นี้
You accessed this page at:<b>);
document.write( ,today.getHours(
),:,today.getMinutes( ),:,today.getSeconds( ));
document.write(</br>);
//- ->
</script>
</center>
</head>
</html>
Test
All Right Reserved 2003 Support IE5.0 or Higher Best Preview
800x600 Pixels
แนะนำติชม:
ดร.ปรัชญนันท์ นิลสุข
:
prachyanun@hotmail.com
.
โปรแกรมไฟล์
Calendar.js
