Chúng ta đưa javascript vào bên trong phần tử html nào?

Một script là một phần nhỏ trong chương trình mà có thể thêm khả năng tương tác cho trang web của bạn. Ví dụ, một script sẽ tạo ra một hộp cảnh báo pop-up hoặc cung cấp một menu từ trên xuống [dropdown]. Script này có thể được tạo ta bằng cách sử dụng JavaScript hoặc VBScript.

Bạn có thể viết các hàm, còn được gọi là event handlers bằng cách sử dụng bất kỳ ngôn ngữ script nào và sau đó bạn có thể kích hoạt những hàm này bằng cách sử dụng các thuộc tính HTML.

Ngày nay, chỉ có Javascript và các framework liên kết là được sử dụng bởi hầu hết các lập trình viên web, VBScript vẫn không được hỗ trợ bởi các trình duyệt lớn.

Bạn có thể lưu đoạn mã Javascript trong một tệp riêng biệt và sau đó bao gồm nó bất cứ ở đâu cần hoặc bạn có thể xác định tính năng bên trong tài liệu HTML. Chúng ta theo dõi từng hàm trong ví dụ phù hợp.

Sử dụng External Script trong HTML

Nếu bạn đang chuẩn bị xác định một tính năng mà sẽ được sử dụng trong các tài liệu HTML khác nhau, thì khi đó nó là tốt hơn nếu giữ các tính năng này trong một tệp JavaScript riêng, rồi sau đó bao tệp đó trong các tài liệu HTML của bạn. Một tệp JavaScript sẽ có đuôi mở rộng là .js và sẽ được bao trong các tệp HTML bằng cách sử dụng thẻ .

Ví dụ

Dưới đây là một hàm Javascript và được lưu trong script.js.

function Hello[]
{
    alert["Hello, World"];
}

Bây giờ, sử dụng tệp Javascript ngoại vi trên trong tài liệu HTML:



Vi du Javascript External Script






Quảng cáo

Nó tạo kết quả sau, và bạn có thể nhấn vào nút đã cho:

Sử dụng Internal Script trong HTML

Bạn có thể viết một script code một cách trực tiếp vào trong tài liệu HTML. Thông thường chúng ta giữ code này trong Header của tài liệu bằng cách sử dụng thẻ , ngoài ra điều này không có giới hạn và bạn có thể đặt đoạn code nguồn trong thẻ trong tài liệu.

Ví dụ



Su dung Internal Script trong HTML


function Hello[]{
   alert["Hello, World"];
}






Nó tạo kết quả sau, và bạn có thể nhấn vào nút đã cho:

Quảng cáo

Xử lí sự kiện trong HTML

Xử lí sự kiện thường gắn các sự kiện nào về chuột hay bàn phím. Bạn có thể định nghĩa logic nghiệp vụ của bạn bên trong các hàm xử lý sự kiện [Event Handler]. Các hàm này có thể dài ngắn tùy theo các sự kiện và nghiệp vụ bạn cần xử lý.

Dưới đây là ví dụ giải thích cách để viết một event handler. Bạn hãy thử viết một hàm đơn giản trong đầu đề của tài liệu. Chúng ta có thể gọi hàm này khi bất kỳ người sử dụng rê chuột qua một đoạn văn.



Vi du Event Handler trong HTML


function EventHandler[]{
   alert["Vi du ham event handler!!"];
}



Re chuot qua dong nay va xem ket qua.

Đoạn mã trên sẽ tạo ra kết quả sau:

Re chuot qua dong nay va xem ket qua.

Ẩn các Script với các Trình duyệt cũ trong HTML

Mặc dù hầu hết [không phải tất cả] các trình duyệt ngày nay đều hỗ trợ Javascript, nhưng vẫn còn có một vài trình duyệt không hỗ trợ. Nếu một trình duyệt không hỗ trợ Javascript, thay vì chạy script của bạn, thì trình duyệt sẽ hiển thị phần code [bạn đã viết] tới người sử dụng. Để ngăn cản điều này, bạn đơn giản có thể đặt các comment xung quanh đoạn code như ở dưới đây:

Ví dụ cho JavaScript:




Ví dụ cho VBScript:



Phần tử trong HTML

Bạn cũng có thể cung cấp thông tin thay thế đến người sử dụng khi mà trình duyệt họ sử dụng không hỗ trợ script. Bạn làm điều này bằng cách sử dụng thẻ .

Ví dụ cho JavaScript:



Trinh duyet cua ban khong ho tro Javascript!

Ví dụ cho VBScript:



Trinh duyet cua ban khong ho tro VBScript!

Xác định ngôn ngữ Script mặc định trong HTML - Thuộc tính content trong HTML

Có thể có một tình huống khi bạn bao rất nhiều tệp script và sau cùng sử dụng nhiều thẻ . Bạn có thể xác định ngôn ngữ script mặc định cho tất cả các thẻ script này. Việc này tiết kiệm cho bạn thời gian từ việc phải xác định ngôn ngữ mỗi khi bạn muốn sử dụng thẻ script trong trang. Dưới đây là một ví dụ:

Ghi nhớ rằng bạn vẫn có thể viết đè lên ngôn ngữ mặc định bởi việc xác định ngôn ngữ trong thẻ script.

Đã có app VietJack trên điện thoại, giải bài tập SGK, SBT Soạn văn, Văn mẫu, Thi online, Bài giảng....miễn phí. Tải ngay ứng dụng trên Android và iOS.

Theo dõi chúng tôi miễn phí trên mạng xã hội facebook và youtube:

Follow fanpage của team //www.facebook.com/vietjackteam/ hoặc facebook cá nhân Nguyễn Thanh Tuyền //www.facebook.com/tuyen.vietjack để tiếp tục theo dõi các loạt bài mới nhất về Java,C,C++,Javascript,HTML,Python,Database,Mobile.... mới nhất của chúng tôi.

Bài học HTML phổ biến khác tại vietjack.com:

  • HTML - Comment
  • HTML - Hình ảnh
  • HTML - Tạo bảng
  • HTML - Tạo danh sách
  • HTML - Thiết lập Background
  • HTML - Thiết lập màu
  • HTML - Thiết lập Font
  • HTML - Form trong HTML

Trang trước

PDF

Trang sau  

Bài viết liên quan

  • 160 bài học ngữ pháp tiếng Anh hay nhất

  • 155 bài học Java tiếng Việt hay nhất

  • 100 bài học Android tiếng Việt hay nhất

  • 247 bài học CSS tiếng Việt hay nhất

  • 197 thẻ HTML cơ bản

  • 297 bài học PHP

  • 101 bài học C++ hay nhất

  • 97 bài tập C++ có giải hay nhất

  • 208 bài học Javascript có giải hay nhất

Học cùng VietJack

Trang web chia sẻ nội dung miễn phí dành cho người Việt.

Lớp 1-2-3 Lớp 4 Lớp 5 Lớp 6 Lớp 7 Lớp 8 Lớp 9 Lớp 10 Lớp 11 Lớp 12 Lập trình Tiếng Anh

Chính sách

Chính sách bảo mật

Hình thức thanh toán

Chính sách đổi trả khóa học

Chính sách hủy khóa học

Tuyển dụng

Liên hệ với chúng tôi

Tầng 2, số nhà 541 Vũ Tông Phan, Phường Khương Đình, Quận Thanh Xuân, Thành phố Hà Nội, Việt Nam

Phone: 084 283 45 85

Email: vietjackteam@gmail.com

CÔNG TY TNHH ĐẦU TƯ VÀ DỊCH VỤ GIÁO DỤC VIETJACK

Người đại diện: Nguyễn Thanh Tuyền

Số giấy chứng nhận đăng ký kinh doanh: 0108307822, ngày cấp: 04/06/2018, nơi cấp: Sở Kế hoạch và Đầu tư thành phố Hà Nội.

Chủ Đề