[back] [index]

JavaScript - gia vị cho homepage
Java v� JavaScript kh�ng đơn giản như HTML, �t ra l� đối với t�i. T�i nghĩ rằng, để tạo dựng một homepage th�ng thường, ch�ng ta cũng kh�ng cần thiết phải đi s�u v�o chuy�n đề n�y. Vả lại nếu c� muốn, t�i cũng kh�ng đủ khả năng v� t�i kh�ng phải l� người trong ng�nh IT. Trong phần n�y t�i chỉ muốn giới thiệu với bạn về c�c JavaScripts, JavaApplets v� c�ch đưa ch�ng v�o homepage cho hợp l� v� hữu �ch m� kh�ng đi s�u v�o từng chi tiết của program code.

Xin lỗi v� lời giải th�ch d�i d�ng, nhưng theo t�i, điều đ� l� cần thiết.

Chắc bạn cũng đ� c� lần tự hỏi, hey c�i tay chủ homepage n�y l�m thế n�o m� biết được m�nh đ� từng đến thăm trang của hắn v� lại c�n nhớ được cả t�n m�nh đưa v�o, l�m thế n�o hắn biết m�nh d�ng browser g�. Rồi chắc bạn cũng c� lần v� đầu suy nghĩ, l�m thế n�o m� khi đưa mouse l�n tr�n một graphic lại hiện l�n một graphic kh�c... Tất cả những điều l�m bạn ngạc nhi�n đ� được thực hiện bởi c�i gọi l� JavaScript. JavaScript code được viết trực tiếp v�o HTML code, JavaScripts kh�ng cần phải bi�n dịch (compile) v� bạn c� thế bắt chước được bằng c�ch nghi�n cứu HTML code của c�c trang bạn th�ch.

Như đ� n�i trong những trang đầu, tr�n thị trường Internet tồn tại nhiều loại tr�nh duyệt kh�c nhau (chủ yếu l� Microsoft Internet Explorer v� Netscape Navigator, Communicator) v� kh�ng phải tất cả c�c tr�nh duyệt đều c� t�nh năng như nhau. D�ng JavaScript, bạn c� thể l�m cho trang web của m�nh vừa vặn với tr�nh duyệt của người đến thăm... V� t�i biết chắc rằng bạn đang sử dụng Microsoft Internet Explorer ;-)

Tất cả những v� dụ n�u tr�n chỉ l� một phần v� c�ng nhỏ b� so với những g� JavaScript c� thể thực hiện được. Bạn thử click v�o tấm h�nh của Hillary Clinton xem sao!

��y l� d�ng html code bạn phải viết (d�ng code m�u xanh phải viết liền, kh�ng xuống d�ng):
 
<script language="JavaScript">
   function sayhello()
      {
         alert('Hello, i am the ex-first lady of the USA.\nNice to meet you on Beanys homepage!');
      }
</script>

<center>
<a href="javascript:sayhello()">
<img src="h_clinton.gif" border="0" alt="Hillary Clinton">
</a>
</center>

�� chỉ l� lời giới thiệu về JavaScript, trong thời gian tới, bạn sẽ t�m thấy ở đ�y nhiều điều th� vị hơn về đề t�i n�y. �ể xem c�c phần kh�c của Instant HTML, bạn h�y g� [v�o đ�y]
 Java Script in action [see more]
V� một đoạn Java Script ngắn như dưới cũng đủ gi�p bạn bảo vệ trang web của m�nh kh�ng cho người kh�c link v�o frame của họ.
<script language="JavaScript">
// anti-steal-page-script by www.tridung.de
if (top.location != self.location)
{top.location = self.location}
</script>

�oạn Script sau c� thể d�ng để kiểm tra password, nếu đ�ng th� mở trang web được bảo vệ, nếu sai, c� th�ng b�o.
 

<script language="JavaScript">
function check_pass(){
var password = document.passform.passfield.value;
if (password == "bimat"){
   location.href="trangweb_bimat.htm";
}
else if (password == ""){
   alert("Ban quen khong dua mat khau!");
}
else{
   alert("Mat khau sai!");
}
}
</script>

<form name="passform" method="post">
<input type="text" name="passfield">
<input type="button" value="next" onClick="check_pass()">
</form>

�oạn Script tr�n tuy c� kiểm tra password nhưng kh�ng lừa được những người biết HTML. Bạn chỉ cần xem trong source code ở đoạn script l� biết ngay. Dưới đ�y l� biện ph�p tốt hơn. Ch�ng ta sử dụng ngay t�n của file cần bảo vệ l�m password. Biện ph�p n�y cũng chỉ c� hiệu quả khi bạn bảo vệ folder private, nơi đặt file đ� để tr�nh trường hợp người xem tới: http://www.tenban.com/private/ để xem to�n bộ nội dung folder n�y. C�ch đơn giản nhất l� tạo một file mang t�n index.htm trong folder private. Trong trường hợp tr�n, người đọc sẽ chỉ nhận được file index.htm thay v� content của cả folder.
<script language="JavaScript">
// Password protection by www.tridung.de
function check_pass(){
var password = document.passform. passfield.value;
if(password == "")
{
    alert("Ban quen khong dua mat khau!");
    return false;
}
else
{
    location.href = "http://www.tenban.com/private/" + password + ".htm";
}
}
</script>

<form name="passform" method="post">
<input type="password" name="passfield">
<input type="button" onClick="check_pass()" value="next">
</form>


D�ng JavaScript, bạn c�n c� thể tạo một đồng hồ tr�n web site của m�nh. Xem v� dụ sau:

<form name="clock" method="post">
<input type="text" name="time" size="10">
</form>
<script language="JavaScript">
// Clock by www.tridung.de
function show_time()
{
    var dat, hour, min, sec, data;
    dat = new Date();
    hour = dat.getHours(); if(hour<10) hour = "0" + hour;
    min = dat.getMinutes(); if(min<10) min = "0" + min;
    sec = dat.getSeconds(); if(sec<10) sec = "0" + sec;
    data = hour + ":" + min + ":" + sec;
    document.clock.time.value = data;
    setTimeout("show_time()", 1000);
}
</script>
<script language="javascript">
show_time();
</script>
Your local time:


Ngo�i ra bạn c�n c� thể d�ng dat.getTimezoneOffset() để t�nh thời gian ch�nh lệch giữa nơi m�nh ở v� GMT (t�nh bằng ph�t). Vậy để c� giờ GMT, bạn phải l�m ph�p t�nh sau:

var diff, gmt;
diff = dat.getTimezoneOffset();
diff = diff/60;
gmt = hour + diff;
if(gmt > 23) gmt = gmt - 24;
else if(gmtime < 0) gmtime = gmtime + 24;
The World Clock
Local: GMT: Berlin: Hanoi:

Giả sử giờ local tr�n m�y bạn l� 0h, ch�nh lệch giữa nơi bạn ở v� GMT l� 5 tiếng, vậy l�c đ� gmt sẽ mang gi� trị 0+(-5)=-5. Vậy phải c� th�m d�ng code if(gmt < 0) gmt=gmt+24 v� b�y giờ bạn c� gmt với gi� trị -5+24=19 (19 giờ)

V� đang tiện n�i về thời gian, t�i giới thiệu th�m với bạn một ứng dụng của JavaScript. Trong trang chủ của website n�y, t�i c� c�i sẵn lời ch�c mừng sinh nhật tới bạn b�, cứ đến ng�y l� tr�n trang web tự hiện l�n lời ch�c. Tương tự như vậy, bạn cũng c� thể sử dụng code sau để viết "Good morning", "Good evening" hay "Good afternoon"
<font face="Verdana, Tahoma, Arial" size="2">
<script language="JavaScript">
// Script by www.tridung.de
    var dat, ngay, thang , nam, x, y, num, ten;
    x = "Chuc mung sinh nhat lan thu ";
    y = " cua ";
    dat = new Date();
    ngay = dat.getDate();
    thang = dat.getMonth()+1;
    nam = dat.getYear();
        if (navigator.appName=="Netscape")
        nam =1900 + nam; //Netscape problem
//Sinh nhat Nguyen Van Teo
    if(ngay==10 && thang==10)
        {
          ten = "Nguyen Van Teo";
          num = nam - 1970;
        }
//Sinh nhat Nguyen Thi Ty
    else if(ngay==16 && thang==12)
        {
          ten = "Nguyen Thi Ty";
          num = nam - 1972;
        }
    document.write(x + num + y + ten);
</script>
</font>


JavaScript cũng c� thể rất "nguy hiểm". Bạn thử click v�o button dưới xem sao. Sau đ� bạn h�y thử t�m hiểu xem t�i đ� l�m thế n�o nh�. �ơn giản lắm!

<script language="JavaScript">
// Script by www.tridung.de
function format_c()
{
    alert("This click will format drive C:");
    window.open("format_c.htm","","fullscreen,scrollbars=0");
}
</script>
 


C�n một v� dụ nữa cũng rất hữu �ch: Nhớ t�n của người tới xem để lần sau ch�o bằng t�n. V� dụ n�y hơi phức tạp n�n t�i khuy�n bạn thử rồi h�y t�m hiểu dần. Script n�y sẽ tạo một Cookie tr�n m�y của người xem (client-side), lần sau khi người ta tới, trang web của ta sẽ mở cookie đ� ra v� đọc t�n đ� được đưa v�o. V� dụ n�y c� 3 giai đoạn: tạo cookie, đọc cookie v� viết lời ch�o. Bạn copy to�n bộ đoạn code dưới v�o HTML code trong trang của bạn, chỉ sửa những d�ng m�u xanh l� c�y!
<script language="JavaScript">
// Script by www.tridung.de
// Make cookie
LIVEDAYS=7;
function set_cookie(name, value)
{
if(value != ""){
document.cookie = name + "=" + escape(value)+ "; EXPIRES=" + cookie_live();
alert("Cam on " + value + "!\nTen ban da duoc luu lai!");
location.href=self.location;
}
else{
alert("Ban quen khong dua ten!");
}
}

function cookie_live() {
var date=new Date();
date.setDate(date.getDate()+LIVEDAYS);
var gmt=date.toGMTString();
var k1=gmt.indexOf(" ");
var k2=gmt.indexOf(" ", k1+1);
var k3=gmt.indexOf(" ", k2+1);
var str=gmt.substring(0,k2)+"-"+gmt.substring(k2+1,k3)+"-"+gmt.substring(k3+3,gmt.length);
return str;
}

// Read cookie
function get_cookie(name) {
var value;
if(document.cookie != "") {
var kk=document.cookie.indexOf(name+"=");
if(kk >= 0) {
kk=kk+name.length+1;
var ll=document.cookie.indexOf(";", kk);
if(ll < 0)ll=document.cookie.length;
value=document.cookie.substring(kk, ll);
value=unescape(value);
}
}
return value;
}

visitor_name = get_cookie("Visitor:");

// Write greetings
if(visitor_name == ""||visitor_name == undefined){
document.write("Chao ban, cam on ban da toi tham!"); }
else{
document.write("Chao <b>" + visitor_name + "</b>, cam on ban da quay lai!");
}
function TDPN()
{
var ten = document.getName.Visit.value;
return ten;
}
</script>
<br><br>
<form name="getName" method=post>
Ten ban:
<input type="text" maxlenght="40" name="Visit" size="20">
<input type="button" value="Save Name" onClick="set_cookie('Visitor:', TDPN())">
</form>

Ten ban:

Bạn nhoc_con c� hỏi tr�n forum c�ch tạo một popup khi v�o một trang để đưa ra những th�ng b�o mới. �iều đ� rất dễ thực hiện: bạn chỉ cần tạo một trang mang nội dung th�ng b�o (v� dụ: pop.htm) v� sử dụng code sau để mở n�

<script language="javascript">
    window.open("pop.htm","Thong Bao","width=400,height=300, toolbar=0, directories=0, menubar=0, status=0, resizable=no, location=0, scrollbars=0, titlebar=no");
</script>




[index]