Câu hỏi Jquery: Làm thế nào để kiểm tra xem phần tử có lớp / kiểu css nhất định không


Tôi có một div:

<div class="test" id="someElement" style="position: absolute"></div>

Có cách nào để kiểm tra xem yếu tố nào đó không:

$("#someElement") 

có một lớp cụ thể (trong trường hợp của tôi là "test").

Cách khác, có cách nào để kiểm tra xem nguyên tố vi có một kiểu nào đó không? Trong ví dụ này, tôi muốn biết liệu phần tử có "position: absolute".

Cảm ơn nhiều!


75
2018-04-17 08:56


gốc


không chắc chắn nếu nó là câu hỏi hoặc câu trả lời sai, nhưng câu hỏi có style = "test", và câu trả lời sẽ cho class = "test" - wheresrhys
Tôi đoán là, câu hỏi là sai, vì anh ta đánh dấu sai câu trả lời đúng; nhưng bất kể, sau khi nhìn vào phiếu bầu, tôi nghĩ hầu hết mọi người đều tình cờ tìm thấy câu trả lời đúng cho câu hỏi sai này ... er, nếu điều đó có ý nghĩa gì ... Câu trả lời từ DrJokepu, ý tôi là. Đó là lý do tại sao tôi ở đây ít nhất. - BrainSlugs83


Các câu trả lời:


if($('#someElement').hasClass('test')) {
  ... do something ...
}
else {
  ... do something else ...
}

51
2018-04-17 09:01



Cảm ơn nhiều. Giải pháp hoàn hảo - 0100110010101
Điều này không trả lời câu hỏi như được hỏi - xem câu trả lời của DrJokepu bên dưới. - Ryan Burney
hoạt động hoàn hảo cho tôi cảm ơn :) - Rajnikanth


Kiểu CSS là cặp khóa-giá trị, không chỉ là "thẻ". Theo mặc định, mỗi phần tử có một tập hợp đầy đủ các kiểu CSS được gán cho nó, hầu hết trong số chúng được sử dụng ngầm định mặc định của trình duyệt và một số phần tử được định nghĩa lại rõ ràng trong các tệp định kiểu CSS.

Để có được giá trị được gán cho một mục CSS cụ thể của một phần tử và so sánh nó:

if ($('#yourElement').css('position') == 'absolute')
{
   // true
}

Nếu bạn không xác định lại kiểu, bạn sẽ nhận được mặc định của trình duyệt cho phần tử cụ thể đó.


251
2018-04-17 09:02



wow không biết điều đó. cảm ơn bạn!! - 0100110010101
Không có cách nào để làm điều đó với một bộ chọn? - BrainSlugs83
với điều này bạn có thể thấy tài sản thực sự là gì, những gì tôi cần biết là nếu thuộc tính này đang được thiết lập trực tiếp hoặc nó được thừa hưởng từ kiểu css / trình duyệt ... thì có thể không? - ante.sabo
Tuyệt vời cảm ơn bạn rất nhiều - Thamaraiselvam
Dường như không hoạt động cho kịch bản nếu giá trị thay đổi DOM / css của một đối tượng thay đổi sau khi tải trang. Bất kỳ ý tưởng làm thế nào để có được nó để xem thay đổi css sau khi tải DOM? - Collarbone


if ($("element class or id name").css("property") == "value") {
    your code....
}

12
2018-02-26 12:43





Tôi đã tìm thấy một giải pháp:

$("#someElement")[0].className.match("test")

nhưng bằng cách nào đó tôi tin rằng có một cách tốt hơn!


1
2018-04-17 09:01





Hoặc, nếu bạn cần truy cập vào phần tử có thuộc tính đó và nó không sử dụng id, bạn có thể đi theo tuyến đường này:

$("img").each(function () {
        if ($(this).css("float") == "left") { $(this).addClass("left"); }
        if ($(this).css("float") == "right") { $(this).addClass("right"); }
    })

1
2018-01-21 23:25





Câu hỏi đang hỏi hai điều khác nhau:

  1. Một phần tử có một lớp nhất định
  2. Một yếu tố có phong cách nhất định.

Câu hỏi thứ hai đã được trả lời. Đối với người đầu tiên, tôi sẽ làm theo cách này:

if($("#someElement").is(".test")){
    // Has class test assigned, eventually combined with other classes
}
else{
    // Does not have it
}

0
2017-07-29 14:22





Nếu bạn sử dụng jQuery, và muốn kiểm tra theo phong cách nhất định thì mã của bạn sẽ

if($('#someElement').css('position', 'absolute')) {
  ... do something ...
}
else {
  ... do something else ...
}

và nếu bạn muốn kiểm tra theo lớp thì

if($('#someElement').hasClass('test')) {
  ... do something ...
}
else {
  ... do something else ...
}

jQuery CDN

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

-1
2018-05-24 09:42