Mục lục học JavaScript
- Đăng ký kênh tại đây: https://www.youtube.com/channel/UCXjV9sLt3WgamL7vofLofow?sub_confirmation=1
- Trang fan page: https://www.facebook.com/lophocvitinhcom
- Trang web: http://lophocvitinh.com
Để xuất dữ liệu trong JavaScript ta có 05 cách sau đây:
1.innerHTML
Gắn dữ liệu vào 01 thẻ có id tương ứng.
Ví dụ:
<!DOCTYPE html>
<html>
<head>
<title>Tự học JavaScript</title>
<script>
function myFunction(){
document.getElementById("demo").innerHTML = "Chụt chụt chụt JavaScript!!!";
}
</script>
</head>
<body>
<h1 id="demo"></h1>
<button type="button" onclick="myFunction()">Bấm vào đây!!!</button>
</body>
</html>
2.document.write()
Chú ý: nếu dùng document.write() sau khi đã tải xong toàn bộ tài liệu HTML=>tất cả phần HTML sẽ bị xóa =>chỉ nên dùng phương thức này trong quá trình kiểm tra mã.
Ví dụ:
dùng lại ví dụ trên nhưng thay đoạn mã:
document.getElementById("demo").innerHTML = "Xin chào JavaScript!!!";
bằng đoạn mã:
document.write("<h1>Xin chào JavaScript!!!</h1>");
3.window.alert()
Hiển thị dữ liệu trong 01 hộp thoại.
Chú ý: ta có thể bỏ từ khóa window cũng được vì trong JavaScript, đối tượng window là đối tượng có phạm vi toàn cục global. Có nghĩa là các biến, phương thức, thuộc tính đều mặc định thuộc về đối tượng window=> từ khóa window dùng hay không là tùy ý.
Ví dụ:
dùng lại ví dụ trên nhưng thay đoạn mã:
document.write("<h1>Xin chào JavaScript!!!</h1>");
bằng đoạn mã:
window.alert("Xin chào JavaScript!!!");
hoặc:
alert("Xin chào JavaScript!!!");
4.console.log()
Công cụ console này nếu trong Microsoft Edge dùng phím Ctrl+Shift+i (trong menu là chọn mục Công cụ dành cho Nhà phát triển – Tool for Developers) mới thấy được kết quả xuất ra.
Ví dụ:
thay đoạn mã:
window.alert("Xin chào JavaScript!!!");
bằng đoạn mã:
console.log("Xin chào JavaScript!!!");
5.window.print()
In nội dung toàn trang web.
Ví dụ:
<!DOCTYPE html>
<html>
<head>
<title>Tự học JavaScript</title>
</head>
<body>
<h1 id="demo">Nội dung cần in ra!!!</h1>
<button type="button" onclick="window.print()">In ra</button>
</body>
</html>
Nếu vẫn chưa rõ các bạn xem thêm video clip sau:
- Đăng ký kênh tại đây: https://www.youtube.com/channel/UCXjV9sLt3WgamL7vofLofow?sub_confirmation=1
- Trang fan page: https://www.facebook.com/lophocvitinhcom
- Trang web: http://lophocvitinh.com
By #drM
Nguồn w3schools
Không có nhận xét nào:
Đăng nhận xét