Hướng dẫn dùng javascri JavaScript

Hướng dẫn dùng javascri JavaScript
Nhóm phát triển của chúng tôi vừa ra mắt website langlearning.net học tiếng Anh, Nga, Đức, Pháp, Việt, Trung, Hàn, Nhật, ... miễn phí cho tất cả mọi người.
Là một website được viết trên công nghệ web Flutter vì vậy hỗ trợ rất tốt cho người học, kể cả những người học khó tính nhất.
Hiện tại website đang tiếp tục được cập nhập nội dung cho phong phú và đầy đủ hơn. Mong các bạn nghé thăm và ủng hộ website mới của chúng tôi.

Hướng dẫn dùng javascri JavaScript
Hãy theo dõi chúng tôi trên Fanpage để nhận được thông báo mỗi khi có bài viết mới.
Hướng dẫn dùng javascri JavaScript
Facebook

1- Mục tiêu của bài học

Javascript vs ECMAScript

JavascriptECMAScript là 2 cái tên khác nhau, nhưng chúng lại có một mối quan hệ rất chặt chẽ với nhau. Bản chất Javascript chính là một ngôn ngữ được phát triển theo các tiêu chuẩn được định nghĩa bởi ECMAScript. Đó là lý do vì sao các chủ đề về Javascript và chủ đề về ECMAScript được chúng tôi đặt xen kẽ với nhau.

-

Nếu bạn là người mới bắt đầu với Javascript tôi khuyến nghị bạn nên đọc bài viết dưới đây để hiểu hơn về mối quan hệ này:

Javascript là một ngôn ngữ lập trình, các đoạn mã Javascript được nhúng trong HTML giúp cho trang web có thể tương tác với người dùng.

Ví dụ dưới đây là một trang HTML với một thẻ

Hướng dẫn dùng javascri JavaScript
hiển thị một cái bóng đèn đang trong trạng thái tắt (off), Javascript có thể thay đổi giá trị của thuộc tính src (
Hướng dẫn dùng javascri JavaScript
) để thay thế ảnh cũ bởi một ảnh mới, ảnh cái đèn trong trạng thái bật (on).

Hướng dẫn dùng javascri JavaScript

Mục tiêu của bài học này giúp bạn hiểu làm thế nào để nhúng Javascript vào trong HTML và thực hành với một vài ví dụ đơn giản, tất cả các ví dụ này chỉ nhằm mục đích giúp bạn làm quen với Javascript trước khi đi vào các chủ đề chi tiết hơn.

2- Viết Javascript trong HTML

Javascript có thể được viết bên trong HTML, cụ thể nó được viết bên trong thẻ :

Hướng dẫn dùng javascri JavaScript

Các thẻ

helloworld.html




   
      Hello Javascript

      

   
   

      

   


 

Chạy tập tin helloworld.html trên trình duyệt và xem kết quả:

Hướng dẫn dùng javascri JavaScript

Ở ví dụ trên, trong thẻ tôi tạo hàm sayHello(). Khi người dùng nhấn vào Button, hàm sayHello() sẽ được gọi, và nó hiển thị một dialog với nội dung "Hello Everyone!". Đừng lo lắng nếu bạn chưa biết hàm là gì, hãy tạm thời bỏ qua điều đó.

Hướng dẫn dùng javascri JavaScript

3- Viết Javascript trong tập tin riêng biệt

Viết mã Javascript trong một tập tin riêng biệt, sau đó HTML sẽ nhập khẩu tập tin này để sử dụng đây là cách giúp bạn quản lý mã Javascript của bạn tốt hơn, và tập tin Javascript có thể được chia sẻ cho nhiều tập tin HTML.

Javascript được viết trong một tập tin với phần mở rộng (extension) là js, Các tập tin HTML sẽ nhập khẩu tập tin Javascript nói trên để sử dụng.

Hướng dẫn dùng javascri JavaScript

Tiếp theo là ví dụ với cái đèn (Light), trong ví dụ này chúng ta cần 4 tập tin:

Hướng dẫn dùng javascri JavaScript

light.js


function turnLightOn()  {
  var img = document.getElementById("myImage");
  img.src = "light-on.gif";
}

function turnLightOff()  {
  var img = document.getElementById("myImage");
  img.src = "light-off.gif";
}

 

light.html




   
      Light

      
      
   
   
      

What Can JavaScript Do?

JavaScript can change HTML attribute values.

In this case JavaScript changes the value of the src (source) attribute of an image.

Hướng dẫn dùng javascri JavaScript