07/09/2018, 10:54

Cú Pháp jQuery

Cú Pháp Trong jQuery Với jQuery bạn chọn các phần tử HTML và thực hiện "các hành động" trên chúng. jQuery được thiết kế riêng để lựa chọn các phần tử HTML và thực hiện một số hành động trên các phần tử Cú pháp cơ bản là: $(selector).action() trong đó: Dấu $ để định nghĩa / truy ...

Cú Pháp Trong jQuery

Với jQuery bạn chọn các phần tử HTML và thực hiện "các hành động" trên chúng.

jQuery được thiết kế riêng để lựa chọn các phần tử HTML và thực hiện một số hành động trên các phần tử

Cú pháp cơ bản là:

$(selector).action()

trong đó:

  • Dấu $ để định nghĩa / truy cập jQuery
  • Một (selector) để "truy vấn (hoặc tìm)" các phần tử HTML
  • Một jQuery action() là một hành động nào đó trên (các) phần tử

Ví dụ:

$(this).hide() // ẩn phần tử hiện tại.

$("p").hide() // ẩn tất cả các phần tử <p>

$(".test").hide() // Ẩn tất cả các phần tử với class = "test".

Bạn có quen thuộc với bộ chọn CSS không?

jQuery cũng sử dụng cú pháp CSS để chọn các phần tử. Bạn sẽ tìm hiểu thêm về cú pháp chọn trong chương tiếp theo của hướng dẫn này.

Làm Thế Nào Để Gọi Một Hàm Thư Viện jQuery?

Bạn có thể nhận thấy rằng tất cả các phương thức jQuery trong các ví dụ của chúng ta, nằm bên trong hàm $(document).ready().

Mọi thứ bên trong hàm đó sẽ tải ngay khi DOM được tải và trước khi nội dung trang được tải.

$(document).ready(function(){

    // các hàm jQuery viết ở đây...

});

Điều này là để ngăn chặn bất kỳ đoạn code jQuery nào chạy trước khi tài liệu được tải xong.

Để gọi khi có bất kỳ chức năng thư viện jQuery nào, hãy sử dụng các thẻ HTML <script></script> như hình dưới đây

<html>
   <head>
       <title>The jQuery Example</title>
       <script type = "text/javascript" src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
       </script>

       <script type = "text/javascript" language = "javascript">
           $(document).ready(function() {
              $("div").click(function() {alert("Hello, world!");});
           });
      </script>
   </head>

   <body>
        <div id = "mydiv">
             Click on this to see a dialogue box.
        </div>
   </body>
</html>

ví dụ trên là khi bạn click vào thẻ <div> có nội dung là "Click on this to see a dialogue box." thì sẽ xuất hiện 1 hộp thoại có nội dung "Hello, world!"

Còn rất nhiều nội dung ở phía trước, các nội dung tiếp theo về jQuery mình sẽ nói trong các bài viết tiếp theo nhé. Cám ơn các bạn đã theo dõi.

0