ID Selector trong jQuery

Cú pháp ID Selector:

    jQuery ("#id")

ID Selector ("#id") chọn một phần tử với thuộc tính id đã cho.

ID Selector trong jQuery tương tự như hàm getElementById() trong Javascript.

Lưu ý: Mỗi id chỉ được sử dụng một lần trong một tài liệu. Nếu có nhiều hơn một phần tử được gán cùng một ID, các truy vấn sử dụng ID đó sẽ chỉ chọn phần tử tìm thấy đầu tiên trong DOM.

Ví dụ ID Selector

Ví dụ 1: Chọn phần tử có id "myDiv" và đặt cho nó một đường viền màu đỏ.

    <!doctype html>
    <html lang="en">
    <head>
      <meta charset="utf-8">
      <title>id demo</title>
      <style>
      div {
        width: 90px;
        height: 90px;
        float: left;
        padding: 5px;
        margin: 5px;
        background-color: #eee;
      }
      </style>
      <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
    </head>
    <body>
     
    <div id="notMe"><p>id="notMe"</p></div>
    <div id="myDiv">id="myDiv"</div>
     
    <script>
    $( "#myDiv" ).css( "border", "3px solid red" );
    </script>
     
    </body>
    </html>
Xem ví dụ »

Ví dụ 2: Chọn phần tử có id "myID.entry [1]" và đặt cho nó một đường viền màu đỏ.

    <!doctype html>
    <html lang="en">
    <head>
      <meta charset="utf-8">
      <title>id demo</title>
      <style>
      div {
        width: 300px;
        float: left;
        padding: 2px;
        margin: 3px;
        background-color: #eee;
      }
      </style>
      <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
    </head>
    <body>
     
    <div id="myID.entry[0]">id="myID.entry[0]"</div>
    <div id="myID.entry[1]">id="myID.entry[1]"</div>
    <div id="myID.entry[2]">id="myID.entry[2]"</div>
     
    <script>
    $( "#myID\\.entry\\[1\\]" ).css( "border", "3px solid red" );
    </script>
     
    </body>
    </html>
Xem ví dụ »