Đối tượng Date

Một phần của tài liệu GIÁO TRÌNH mô ĐUNDCCT JAVASCRIP NGHỀ CÔNG NGHỆ THÔNG TIN TRÌNH độ CAO ĐẲNG (Trang 46 - 51)

- Date là một đối tượng cú sẵn chứa thụng tin về ngày và giờ. - Đối tượng Date khụng cú thuộc tớnh nào.

- Nú cú nhiều phương thức dựng để thiết lập, lấy và xử lý cỏc thụng tin về thời gian.

- Đối tượng Date lưu trữ thời gian theo số mili giõy tớnh từ 1/1/1970 00:00:00 DateObject = new Date(parameters)

BÀI TẬP:

Bài tõp JavaScript 1: Cho người dựng nhập vào tờn và tuổi. Hóy viết lại tờn

và tuổi của người đú ra màn hỡnh bằng hàm document.write, trong đú tờn cú màu đậm, tuổi được gạch chõn.

<HTML>

<HEAD></HEAD> <BODY>

<script language = "JavaScript">

var Ten, Tuoi; // Khai bỏo 2 biến để lưu tờn và tuổi Ten = prompt("Bạn hóy nhập vào tờn ", ""); Tuoi = prompt("Bạn hóy nhập vào Tuổi : ", 20); document.write("Chào bạn : <B> " + Ten + "</B>"); document.write("<BR>"); // Xuống dũng

document.write("Tuổi của bạn là : <U> " + Tuoi + "</U>"); </script>

</BODY> </HTML>

Bài tõp JavaScript 2: Tạo một nỳt nhấn (button) cú name là welcome, value là ” Welcome “. Một textbox cú tờn là msg, value = “Welcome to”.

Hướng dẫn: Sử dụng phương thức (hàm) write của đối tượng document để tạo. Giải mẫu:

<HTML>

<HEAD></HEAD> <BODY>

<script language = "JavaScript">

document.write("Tao Button va Text bang Script<BR>"); document.write("<BR>");

document.write("<input type=button name=welcome value = 'Welcome' ");document.write("onclick = 'alert ('Welcome to JavaScript');' > "); document.write("<input type = text name = msg value = 'Welcome to'>"); </script>

</BODY> </HTML>

Bài tõp JavaScript 3: Tạo một nỳt như trong vớ dụ 2 và thờm chức năng sau: Khi

người dựng click vào nỳt welcome thỡ hiển thị thụng bỏo “Welcome to JavaScript”

Hướng dẫn: Dựng thẻ để tạo nỳt nhấn và thờm thuộc tớnh onClick = “<Cõu lệnh

JavaScript>;” (Trong đú <Cõu lệnh JavaScript> cú thể là một lệnh JavaScript bất kỳ, vớ dụ lệnh document.write, alert, prompt hoặc lệnh gọi hàm v.v...)

Giải mẫu:

<HTML>

<HEAD></HEAD> <BODY>

<input type=button name= welcome value="Welcome" onclick="alert('Welcome to JavaScript');">

</BODY> </HTML>

Lưu ý quan trọng: Trong JavaScript, một hằng xõu được bao bởi cặp nhỏy đơn

hoặc nhỏy kộp, vớ dụ cỏc xõu: ‘nhỏy đơn’, “nhỏy kộp” là những xõu hợp lệ, tuy nhiờn bạn viết: ‘abc” hay “xyz’ là những xõu khụng hợp lệ. Trong trường hợp bạn muốn in chớnh bản thõn dấu nhỏy đơn hoặc nhỏy kộp ra màn hỡnh thỡ bạn đặt trước nú một ký tự \, vớ dụ bạn cú thể in ra màn hỡnh dũng chữ: Women’s day ra màn hỡnh bằng hai hàm alert và document theo cỏc cỏch sau đõy: alert(“Women’s day”), document.write(‘Women\’s day’); alert(“Women\”s day”); alert(‘Women”s day’); v.v...

Bài tõp JavaScript 4: Lấy (đọc) giỏ trị của một phần tử HTML

Tạo 2 phần tử như trong vớ dụ 2 bằng thẻ HTML, khi người dựng click chuột vào nỳt Welcome thỡ hiển thị nội dung chứa trong text cú tờn là msg.

Hướng dẫn: Để lấy giỏ trị của một phần tử HTML, bạn viết <Tờn phần tử>.value

Vớ dụ: msg.value cho ta giỏ trị của text tờn là msg.

Giải mẫu:

<HTML>

<HEAD></HEAD> <BODY>

<input type = button name = welcome value = "Welcome" onclick = "alert(msg.value)">

<input type = text name = msg value = "Welcome to JavaScript" size = 30> </BODY>

</HTML>

Bài tõp JavaScript 5: Khai bỏo hàm trong JavaScript và cỏch liờn kết nỳt nhấn với

một hàm

Tạo 2 phần tử như vớ dụ 2, khi người dựng nhấn nỳt thỡ gọi một hàm cú tờn là HienThi, hàm hiến thị cú chức năng hiến thị nội dung trong text cú tờn là msg ở trờn.

Hướng dẫn: Trong thẻ tạo button, bạn đặt thuộc tớnh onClick = “<Tờn hàm>”, trong

trường hợp này bạn đặt OnClick = “HienThi()”. Điều này cú nghĩa là khi người sử dụng Click chuột (OnClick = Click chuột) thỡ trỡnh duyệt hóy gọi hàm HienThi(). Cũng giống như trong ngụn ngữ C, Một hàm bắt buộc phải cú cặp ngoặc đơn, cho dự cú tham số hay khụng. Vớ dụ khi gọi hàm HienThi thỡ bạn phải viết là HienThi(). Giải mẫu:

<HTML> <HEAD>

<Script Language = "JavaScript">

function HienThi() // Khai bỏo một hàm tờn là HienThi

{ ,

alert(msg.value); // Lấy nội dung trong text box và hiến thị alert("Bạn hóy nhập vào ụ text và thử lại !");

}

</Script> </HEAD> <BODY>

<input type = button name = welcome value = "Welcome" onclick = "HienThi()"> <input type = text name = msg value = "Welcome to JavaScript" size = 30> </BODY>

</HTML>

Lưu ý: Trong C, để khai bỏo một hàm thường bạn viết, vớ dụ: int HienThiộ v...v..

Tuy nhiờn, với JavaScript cú hơi khỏc tớ chỳt, thay vào đú bạn viết function

HienThiộ.

Bài tõp JavaScript 6: Minh hoạ cỏch khai bỏo và sử dụng đối tượng Date trong JavaScript đế hiến thị ngày giờ của hệ thống.

Yờu cầu: Hóy hiến thị ngày và giờ của hệ thống mỏy tớnh khi trang Web được nạp.

Hướng dẫn: Sử dụng đối tượng Date và sử dụng cỏc hàm lấy thứ, ngày, thỏng, năm

để in thụng tin ra màn hỡnh. Chỳ ý đến cỏc hàm tớnh thỏng, ngày trong tuần bị hụt một đơn vị.

Bài tõp JavaScript 7: Minh hoạ sử khai bỏo và dựng đối tượng Date để lấy giờ,

phỳt, giõy của hệ thống.

Yờu cầu: Hiển thị Giờ và phỳt trong thanh tiờu đề của cửa sổ khi trang Web được

nạp.

Hướng dẫn: Giỏ trị hiển thị trong thanh tiờu đề của trang web được lưu trong thuộc

tớnh title của đối tượng document, do vậy để hiển thị thụng tin trờn thanh tiờu đề, bạn cần viết: document.title = <Giỏ trị>. Vớ dụ, để hiển thị dũng chữ “Hello Every body !”, bạn viết: document.title “Hello Every body !”

Minh hoạ:

<HTML> <BODY>

<script language="JavaScript"> var D = new Date();

document.title = "Bõy giờ là: " + D.getHours()+" giờ "+ D.getMinutes()+ " phỳt."; </script>

</BODY> </HTML>

Bài tõp JavaScript 8: Vận dụng biến đối tượng Date để tớnh tuổi của một người.

Yờu cầu : Cho người dựng nhập vào năm sinh của họ, sau đú hiển thị tuổi tương

ứng.

Hướng dẫn: Sử dụng đối tượng Date để lấy năm hiện tại. Tuổi sẽ bằng năm hiện tại

trừ đi năm sinh vừa nhập vào.

Minh hoa mẫu:

<HTML>

<TITLE>Tớnh tuổi</TITLE> <BODY>

<script language="JavaScript"> var D = new Date();

NamHienTai = D.getYear(); // Lưu năm hiện tại vào biến NamSinh = prompt("Bạn sinh năm bao nhiờu ? : ","");

alert("Tuổi của bạn bõy giờ là : " + (NamHienTai-NamSinh)); </script>

</BODY> </HTML>

Bài tõp JavaScript 9: Tương tự như bài 3 nhưng năm sinh nhập vào khụng được

lớn hơn năm hiện tại.

Hướng dẫn: Sử dụng vũng lặp do...while để yờu cầu nhập lại nếu năm sinh > năm

hiện tại.

Minh hoa mẫu:

<HTML>

<TITLE>Tinh tuoi</TITLE>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <BODY>

<script language="JavaScript"> var D = new Date();

var NamSinh, NamHienTai;

NamHienTai = D.getYear(); //Lưu năm hiện tại vào biến do {

NamSinh = prompt("Bạn sinh năm bao nhiờu : ","");

} while (parseInt(NamSinh)>NamHienTai); //Nhập lại nếu Năm sinh>năm hiện tại alert("Tuổi của bạn bõy giờ là : " + (NamHienTai-NamSinh));

</script> </BODY> </HTML>

Bài 3: CÁC ĐỐI TƯỢNG CỦA TRèNH DUYỆT TRONG JAVASCRIPT Mó bài: MĐCNTT17.03

Giới thiệu:

Giới thiệu về cỏc đối tượng của trỡnh duyệttrong Javascirpt.

Mục tiờu:

- Nờu được cỳ phỏp, cỏch ỏp dụng, cỏc hàm cơ bản trong javascript - Tạo được tài liệu HTML sử dụng mó javascript trong lập trỡnh - Tớch cực chủ động làm cỏc bài tập thực thành theo đỳng nội dung

Nội dung chớnh:

Một phần của tài liệu GIÁO TRÌNH mô ĐUNDCCT JAVASCRIP NGHỀ CÔNG NGHỆ THÔNG TIN TRÌNH độ CAO ĐẲNG (Trang 46 - 51)

Tải bản đầy đủ (DOCX)

(78 trang)
w