07/09/2018, 10:54
JavaScript Xuất Thông Tin
Khả năng hiển thị của JavaScript JavaScript có thể hiển thị dữ liệu theo nhiều cách: Sử dụng thuộc tính HTML: innerHTML . Sử dụng chức năng xuất của HTML: document.write() . Sử dụng alert box: window.alert() . Sử dụng console.log() . InnerHTML Để sử dụng thuộc tính HTML, ...
Khả năng hiển thị của JavaScript
JavaScript có thể hiển thị dữ liệu theo nhiều cách:
- Sử dụng thuộc tính HTML: innerHTML.
- Sử dụng chức năng xuất của HTML: document.write().
- Sử dụng alert box: window.alert().
- Sử dụng console.log().
InnerHTML
Để sử dụng thuộc tính HTML, JavaScript sẽ dùng phương thức document.getElementById(id).
Thuộc tính id dùng để định nghĩa một phần tử HTML. InnerHTML dùng để định nghĩa nội dung HTML:
Ví dụ:
<!DOCTYPE html>
<html>
<body>
<h2>Ví dụ minh họa: </h2>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = "Hello world";
</script>
</body>
</html>
Đây là cách thông dụng để hiển thị dữ liệu thông tin trong HTML.
Document.write()
document.write() là một cách thuận tiện để test code.
<!DOCTYPE html>
<html>
<body>
<h2>Ví dụ minh họa:</h2>
<script>
document.write("Hello world");
</script>
</body>
</html>
Sau khi trang HTML đã tải xong, nếu sử dụng document.write(), toàn bộ mã HTML từ trước sẽ bị xóa.
<!DOCTYPE html>
<html>
<body>
<h2>Ví dụ minh họa:</h2>
<button type="button" onclick="document.write('Hello world')">Click</button>
</body>
</html>
Phương thức document.write() chỉ nên được dùng để test code.
Window.alert()
Ta có thể sử dụng alert box để hiển thị thông tin.
<!DOCTYPE html>
<html>
<body>
<script>
window.alert(4 + 7);
</script>
</body>
</html>
Console.log()
Để thuận tiện cho việc debug, console.log() có thể được sử dụng để hiển thị dữ liệu.
<!DOCTYPE html>
<html>
<body>
<h2>Ví dụ minh họa:</h2>
<p>Mở chế độ debug bằng cách nhấn phím F12</p>
<p>Chọn "Console" trên thanh menu. Bấm vào nút "Click" bên dưới</p>
<button type="button" onclick="console.log(4 + 7)">Click</button>
</body>
</html> 