: Bộ chọn loại thứ nhất – GeeksforGeeks – jquery đầu tiên của loại

Cổng thông tin Khoa học Máy tính dành cho những người yêu thích máy tính. Nó bao gồm các bài báo về khoa học máy tính và lập trình được viết tốt, được tư duy tốt và được giải thích tốt, các câu đố và thực hành / lập trình cạnh tranh / các câu hỏi phỏng vấn công ty.

Bạn đang xem : jquery đầu tiên thuộc loại

: first-of-type Selector được sử dụng để chọn tất cả các phần tử là con đầu tiên, thuộc một loại cụ thể, của cha mẹ chúng.

Cú pháp:

 $ (": first-of-type") 

Các ví dụ dưới đây minh họa: bộ chọn loại thứ nhất trong jQuery:

Ví dụ 1: Ví dụ này thay đổi background-color thành xanh lục và text-color thành trắng, của tiêu đề đầu tiên của cha mẹ chúng (thẻ div).

< / p>

& lt;! DOCTYPE html & gt;

& lt; html & gt;

& lt; head & gt;

& lt; title & gt;

jQuery | : First-of-type Selector

& lt; / title & gt;

& lt; script src =

" https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js " & gt;

& lt; / script & gt;

& lt; script < / code> & gt;

$ (tài liệu) .ready (function () {

$ ("h4: first-of-type"). css ({

"background-color": "green",

"color": "white"

< code class = "trơn">});

});

& lt; / script & gt;

< / p>

& lt; style & gt;

tùy chọn {

font-weight: bold;

font-size: 25px;

color: green;

chọn {

font-weight: bold;

font-size: 25px;

color: green;

}

& lt; / style & gt;

& lt; / head & gt;

& lt; body style = "text-align: center; width: 500px; margin: auto" & gt;

& lt; h1 & gt;

jQuery | : First-of-type Selector

& lt; / h1 & gt;

& lt; div style = "border: 1px solid blue;" & gt;

& lt; h4 & gt; Tiêu đề đầu tiên trong div đầu tiên. & lt; / h4 & gt; < / code>

& lt; h4 & gt; Tiêu đề cuối cùng trong div đầu tiên. & lt; / h4 & gt;

& lt; / div & gt; & lt; br & gt;

& lt; < code class = "keyword"> div style = "border: 1px solid blue; " & gt;

& lt; h4 & gt; Tiêu đề đầu tiên trong div thứ hai. & lt; / h4 & gt;

& lt; h4 & gt; Tiêu đề cuối cùng trong div thứ hai. & lt; / h4 & gt;

& lt; / div < / code> & gt;

& lt; / body & gt;

& lt; / html & gt;

 
  

Đầu ra:

Ví dụ 2: Ví dụ này thay đổi màu nền thành xanh lục và màu văn bản thành trắng, của tiêu đề đầu tiên của & lt; body & gt; thẻ.




< p class = "line number1 index0 alt2"> & lt;! DOCTYPE html & gt;

& lt; html & gt;

& lt; head & gt;

& lt; title & gt;

jQuery | : First-of-type Selector

& lt; / title & gt;

& lt; script src =

" https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js " & gt;

& lt; / script & gt;

& lt; script & gt;

$ (tài liệu ) .ready (function () {

$ ( "h4: first-of-type"). css ({

"background-color": "green",

"màu": "trắng"

});

});

& lt; / script & gt;

& lt; style & gt;

tùy chọn {< / code>

font-weight: bold; < / p>

font-size: 25px;

< p class = "line number27 index26 alt2"> color: green;

}

chọn {

< code class = "trơn"> font-weight: bold;

font-size: 25px;

color : green;

}

& lt; / style & gt;

& lt; / đầu & gt;

& lt; body style = < / code> "text-align: center; width: 500px; margin: auto" & gt;

& lt; h1 & gt;

jQuery | : First-of-type Selector

& lt; / h1 & gt;

& lt; h4 & gt; Tiêu đề đầu tiên trong nội dung. & lt; / h4 & gt;

& lt; h4 & gt; Tiêu đề cuối cùng trong nội dung. & lt; / h4 & gt;

& lt; / body & gt;

& lt; / html & gt;

 
  

Đầu ra:

Các trình duyệt được hỗ trợ:

  • Google Chrome 90.0+
  • Internet Explorer 9.0
  • Firefox 3.6
  • Safari 4.0
  • Opera 10.5

Ghi chú cá nhân của tôi


Xem thêm những thông tin liên quan đến chủ đề jquery đầu tiên của loại

jQuery Tutorial for Beginners #4 - jQuery Statements & the $ Sign

alt

  • Tác giả: The Net Ninja
  • Ngày đăng: 2015-09-29
  • Đánh giá: 4 ⭐ ( 7188 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Yo ninjas, in this jQuery tutorial I'll introduce the jQuery object - the Dollar sign $ - which is used for pretty much every jQuery statement. When we use a jQuery statement, we're essentially 'wrapping' up an element in a jQuery wrapper object, to give it access to many of jquery's methods and properties.

    SUBSCRIBE TO CHANNEL - https://www.youtube.com/channel/UCW5YeuERMmlnqo4oq8vwUpg?sub_confirmation=1

    ========== JavaScript for Beginners Playlist ==========

    https://www.youtube.com/playlist?list=PL4cUxeGkcC9i9Ae2D9Ee1RvylH38dKuET

    ========== CSS for Beginners Playlist ==========

    https://www.youtube.com/playlist?list=PL4cUxeGkcC9gQeDH6xYhmO-db2mhoTSrT

    ========== HTML for Beginners Playlist ==========

    https://www.youtube.com/playlist?list=PL4cUxeGkcC9ibZ2TSBaGGNrgh4ZgYE6Cc

    ========== The Net Ninja ============

    For more front-end development tutorials & to black-belt your coding skills, head over to - https://www.youtube.com/channel/UCW5YeuERMmlnqo4oq8vwUpg or http://thenetninja.co.uk

    ========== Social Links ==========

    Twitter - @TheNetNinja - https://twitter.com/thenetninjauk

jQuery là gì? Tìm hiểu về jQuery

  • Tác giả: topdev.vn
  • Đánh giá: 4 ⭐ ( 7912 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: jQuery là thư viện javascript nổi bật nhất, phổ biến nhất trong lập trình web. Ra đời vào năm 2006 bởi John Resig. Nó đã trở thành một thành phần không thể thiếu trong các website có sử dụng Javascript. Với slogan "Write less – Do more" (viết ít hơn – làm nhiều hơn) nó đã giúp lập trình viên tiết kiệm được rất nhiều thời gian và công sức trong việc thiết kế website.

Tìm hiểu về JQuery part 1

  • Tác giả: viblo.asia
  • Đánh giá: 3 ⭐ ( 1285 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: jQuery là gì? jQuery là một Framework được xây dựng dựa trên các tính năng của JavaScript. Vì thế trong khi phát triển các ứng dụng sử dụng jQuery, bạn có thể sử dụng tất cả các hàm và các tính năng...

jQuery con đầu tiên của “this”

  • Tác giả: vi.gupgallery.com
  • Đánh giá: 3 ⭐ ( 4830 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Tôi đang cố chuyển "this" từ một khoảng được nhấp vào một hàm jQuery để sau đó có thể thực thi jQuery trên phần tử con đầu tiên được nhấp đó. Dường như không thể hiểu đúng ...

Xem thêm các bài viết khác thuộc chuyên mục: Kiến thức lập trình

Xem Thêm  Phương thức JavaScript Array.from () - mảng mới từ mảng javascript