Người Viết : ViKiMi Editor
Những cơ bản nhất để có thể hiểu cách mà JavaScript sẽ thực hiện khi thiết kế một Website
Bạn muốn xem cách mà JavaScript làm việc để tạo nên một Website thì chắc hẳn bạn cần một cái nhìn tổng quan. Trong phần này đưa ra những cách thức dễ hiểu về hoạt động của JavaScript. Và từ đó có thể thấy JavaScript làm việc như thế nào. Lợi thế khi bạn sử dụng JavaScript, nó sẽ giúp Website của bạn trở nên hoàn thiện hơn.
JavaScript mang lại một lợi thế rất lớn khi thiết kế Website.
+ Mọi trình duyệt đều hỗ trợ JavaScript
+ JavaScript là một tiêu chuẩn được công nhận trên thế giới
+ Tốc độ của Trang Web luôn được đảm bảo
Vậy JavaScript có thể giúp bạn thiết kế những gì mà ngôn ngữ này luôn được ưu tiên lựa chọn. Hoặc hầu hết sẽ lựa chọn thư viện thiết kế dưa trên JavaScript. Có vẻ JavaScript là một món mà bạn nên để ý tới nếu bạn muốn thiết kế một Website có giá trị.
+ JavaScript sẽ giúp thiết kế các hiển thị Website
+ JavaScript tạo các hành vi của Website
+ JavaScript giúp kết nối Client và Server
+ JavaScript giúp Website cải thiện tốc độ vì nó là ngôn ngữ hoạt động phía Client
Những ví dụ điển hình dưới đây sẽ giúp bạn làm quen cách JavaScript làm việc :
+ JavaScript cho phép làm việc vả với dấu ngoặc đơn và dấu ngoặc kép ( both double and single quotes )
Example 1 ::
Thay đổi nội dung phần tử HTML bằng JavaScript
<!DOCTYPE html>
<html>
<body>
<h2>THAY ĐỔI NỘI DUNG PHẦN TỬ HTML !</h2>
<p id="paragraph_1"> JavaScript sẽ thay đổi nội dung HTML </p>
<button type="button" onclick='document.getElementById("paragraph_1").innerHTML = "Hello JavaScript!"'> THỰC HIỆN </button>
</body>
</html>
THAY ĐỔI NỘI DUNG PHẦN TỬ HTML !
JavaScript sẽ thay đổi nội dung HTML
Example 2 ::
Thay đổi kiểu Style CSS của phần tử HTML bằng JavaScript
JavaScript sẽ truy cập vào phần tử bằng id và sẽ thay đổi các style cần thiết.
+ Thay đổi kích thước chữ
<!DOCTYPE html>
<html>
<body>
<h2>THAY ĐỔI KIỂU CỦA PHẦN TỬ HTML</h2>
<p id="paragraph_1"> JavaScript sẽ thay đổi kiểu của phần tử HTML </p>
<button type="button" onclick="document.getElementById(' paragraph_1').style.fontSize='35px'"> THỰC HIỆN </button>
</body>
</html>
Example 3 ::
Thực hiện hiển thị phần tử HTML bằng JavaScript.
JavaScript sẽ truy cập vào phần tử bằng id và sẽ hiển thị phần tử.
( Ban đầu phần tử được ẩn )
<!DOCTYPE html>
<html>
<body>
<h2>HIỂN THỊ PHẦN TỬ HTML</h2>
<p id="paragraph_1" style="display:none"> JavaScript sẽ thực hiện hiển thị phần tử HTML </p>
/* Phần tử này đang được ẩn */
<button type="button" onclick="document.getElementById(' paragraph_1').style.display='block'"> THỰC HIỆN </button>
</body>
</html>
Example 4 ::
Thực hiện ẩn phần tử HTML bằng JavaScript.
JavaScript sẽ truy cập vào phần tử bằng id và sẽ ẩn phần tử lựa chọn.
( Ban đầu phần tử được hiển thị )
<!DOCTYPE html>
<html>
<body>
<h2>HIỂN THỊ PHẦN TỬ HTML</h2>
<p id="paragraph_1" style="display:block"> JavaScript sẽ thực hiện hiển thị phần tử HTML </p>
/* Phần tử này đang được hiển thị */
<button type="button" onclick="document.getElementById(' paragraph_1').style.display='none'"> THỰC HIỆN </button>
</body>
</html>
Chúng ta có thể thấy JavaScript đã giúp chúng ta làm nên một Website có tính động và thu hút hơn. Ở trên các ví dụ đều cho thấy cách mà JavaScript làm việc, JavaScript cho phép thay đổi các thiết kế của một trang HTML bằng các xử lý phù hợp.
+ JavaScript đã biến một trang HTML tĩnh thành một Website động và thu hút hơn. Điều này thật quan trọng !
