All (hay Universal)

Kí hiệu đại diện của selector này là *. Khi dùng selector này, chúng ta sẽ chọn tất cả các phần tử trong cây DOM, kể cả phần tử head và các phần tử con của nó. Cú pháp chọn selector này như sau:


$('*')  hay jQuery ('*')

Hay chúng ta có thể viết một cách gián tiếp như sau:


var selectAll = $('*');

với lệnh như trên thì các phần tử trả về từ hàm $() sẽ được lưu trong biến selectAll. Để dễ sử dụng, một quy ước trong cộng đồng jQuery, chúng ta khi dùng tên biến nên có dấu $ là kí tự bắt đầu. Theo quy ước này, chúng ta viết lại lệnh trên:


var $selectAll = $('*');

Như đã đề cập, chúng ta đặt các đoạn mã jQuery trong cặp và cặp script này có thể đặt trong <head > hay đặt ngay trên </body>. Áp dụng nguyên tắc unobtrusive JavaScript, chúng ta có thể đặt các đoạn mã jQuery trong một tập tin riêng biệt, phần mở rộng là .js, và liên kết nó đến trang thông qua <script> (giống cách chúng ta liên kết trang đến thư viện jQuery). Kể từ chương này và các chương sau, tập tin jQuery của chúng ta sẽ là MyjQuery.js (có thể tạo tập tin này bằng cách mở Notepad, gõ các lệnh jQuery và lưu lại với tên là MyjQuery.js và lưu ý mục Save as type chọn All Files). Giả sử chúng ta có tập tin HTML như sau:


<!DOCTYPE html>

  <html>

    <head>

    </head>

    <body>

       <h2>This is a heading</h2>

       <p>This is a paragraph.</p>

       <p>This is another paragraph.</p>

       <button>Click me</button>

    </body>

</html>

Liên kết đến thư viện jQuery và tập tin MyjQuery.js (để đơn giản, tôi giả sử các tập tin như CSS, HTML và JS đặt trong cùng một thư mục):


<!DOCTYPE html>

  <html>

     <head>

       <script src= "jquery-3.1.1.min.js"></script>

       <script src= "MyjQuery.js"></script>

     </head>

     <body>

       .. .

    </body>

  </html>

Chúng ta phải đặt đúng thứ tự các <script> như trên: đầu tiên phải là script liên kết đến thư viện jQuery, kế tiếp là liên kết đến tập tin chứa mã jQuery của chúng ta.

Trong MyjQuery.js viết vài dòng code sau:


$(document).ready(function(){

   $("button").click(function(){

      $("*").hide();

   });

});

ở đây chúng ta viết code cho sự kiện click của phần tử button và sử dụng phương thức hide() trong thư viện jQuery để ẩn tất cả các phần tử trong cây DOM. Sự kiện, phương thức trong jQuery sẽ được tìm hiểu trong các phần sau.

< Học jQuery