Lập trình web tĩnh Html dành cho người mới bắt đầu học lập trình web Mình khuyên các bạn nên học đầy đủ từ bài số 1 trở đi Và kết hợp với video khi sử dụng slide nhưng do video mình chưa có thời gia up lên khi nào có mình sẽ cho link lên mục này
Trang 1Chương này đưa ra các ví dụ rất rõ ràng và chi tiết Sau khi hoàn thành chúng, bạn sẽ hiểu rõ hơn
về mục tiêu của bài học Hãy làm theo các bước hướng dẫn sau:
Phần I – Thực hiện trong 1.5 giờ:
Trong phần này, chúng ta sẽ thực thi một số đoạn mã JavaScript để hiểu rõ hơn về một số khái
niệm
Ví dụ 1: Các thuộc tính của đối tượng Window
1 Mở notepad hoặc một trình soạn thảo văn bản khác
2 Nhập vào đoạn mã sau:
<html>
<body>
<script language="JavaScript">
document.write("<B> Your Window information is as
follows:</B>");
document.write("<BR>");
document.write(window.history);
document.write("<BR>");
document.write(window.location);
document.write("<BR>");
document.write(window.navigator);
</script>
</body>
</html>
Trang 2
Hình 18.1: Kết quả của Ví dụ 1
Ví dụ 2: Các phương thức của đối tượng Window
1 Mở notepad hoặc một trình soạn thảo văn bản khác
2 Nhập vào đoạn mã sau:
<html>
<body>
<script language="JavaScript">
document.write("<B>Opening new window ");
document.write("<BR>");
window.open("http://www.yahoo.com")
</script>
</body>
</html>
Trang 3Hình 18.2: Kết quả của Ví dụ 2
Ví dụ 3: Đối tượng Document
1 Mở notepad hoặc một trình soạn thảo văn bản khác
2 Nhập vào đoạn mã sau:
<HTML>
<HEAD>
<TITLE> Using Document Object </Title>
</HEAD>
<BODY BGCOLOR="lavender">
<script language="JavaScript">
function call()
{
fm.text1.value=document.title;
}
</script>
<FORM name="fm">
<INPUT type = text name = text1 size=30>
Trang 4
Hình 18.3: Kết quả của ví dụ 3
Ví dụ 4: Đối tượng Location
1 Mở notepad hoặc một trình soạn thảo văn bản khác
2 Nhập vào đoạn mã sau:
<HTML>
<HEAD>
<TITLE> Using Document Object </Title>
</HEAD>
<BODY BGCOLOR="lavender">
<H3> Please Enter complete URL: For example http://www.yahoo.com
</H3>
<script language="JavaScript">
function call()
{
location.replace(fm.text1.value);
}
</script>
<FORM name="fm">
<INPUT type = text name = text1 size=30>
<INPUT type= button name= "btn1" value="Click to load your
favorite web site" onClick="call()">
</FORM>
</BODY>
</HTML>
Trang 5Hình 18.4: Kết quả của Ví dụ 4
Ví dụ 5: Đối tượng History
1 Mở notepad hoặc một trình soạn thảo văn bản khác
2 Nhập vào đoạn mã sau:
<HTML>
<HEAD>
<TITLE> Using History Object </Title>
</HEAD>
<BODY BGCOLOR="lavender">
<script language="JavaScript">
function callp()
{
history.back();
}
</script>
<FORM name="fm">
<INPUT type = text name = text1 size=30>
<BR><BR>
<INPUT type= button name= "btn2" value="Click to load previous page"
Trang 6
Hình 18.5: Kết quả của Ví dụ 5
Trang 8
2 Viết một chương trình bằng JavaScript để luyện tập việc sử dụng các thuộc tính URL và
location của đối tượng document, như hình dưới đây:
Gợi ý:
Tạo một form sắp xếp như hình sau
Viết 2 hàm bằng JavaScript
Gọi những hàm dó khi sự kiện onClick của các nút lệnh xảy ra
Sử dụng thuộc tính document.URL và document.location
Trang 10
This page is intentionally left blank
