jQuery를 사용하여 특정 CSS가있는 모든 요소 선택

jQuery를 사용하여 특정 CSS가있는 모든 요소 선택

---

jQuery를 사용하여 특정 CSS 속성이 모든 요소를 ​​사용할 수 있습니까? 예를 들면 :

.Title
{
    color:red;
    rounded:true;
}

.Caption
{
    color:black;
    rounded:true;
}

"반올림"이라는 속성으로 선택하는 방법은 무엇입니까?

CSS 클래스 이름은 매우 유연합니다.

$(".Title").corner();
$(".Caption").corner();

이 두 작업을 하나의 작업으로 바꾸는 방법. 아마도 다음과 가변적입니다.

$(".*->rounded").corner();

이 작업을 수행하는 더 좋은 방법이 있습니까?

---

CSS 선택기를 사용하여 요소에 CSS 속성을 기반으로 요소를 선택할 수 없습니다.

이 작업을 수동으로 수행해야하는 문서의 모든 요소를 ​​선택하고이를 반복하고 관심있는 속성의 계산 된 값을 확인할 수 있습니다 (하지만 실제 CSS 속성 작동하지만 속성으로 구성되지는 않음). 로 rounded). 또한 느릴 것입니다.

편집에 대한 응답으로 업데이트 — 그룹 선택기 :

$(".Title, .Caption").corner();

---

이것은 2 년 된 것이지만 나에게는 여전히 유용하기 때문에 다른 사람들에게도 유용합니다. 내가 한 일은 다음과 같다.

var x = $('.myselector').filter(function () { 
    return this.style.some_prop == 'whatever' 
});

내가 원하는만큼 간결없는 지금을 겹치지 않고 이와 같은 것이 필요하지 않습니다.

---

감사합니다, Bijou. 솔루션을 사용했지만 다음과 같이 순수한 자바 펼쳐 대신 jQuery .css를 사용했습니다.

var x = $('*').filter(function() {
    return $(this).css('font-family').toLowerCase().indexOf('futura') > -1
})

이 예에서는 font-family속성 값에 "Futura"가 포함 된 모든 요소를 ​​선택합니다 .

---

Bijou와 면책합니다. 약간의 향상 :

$('[class]').filter(function() {
    return $(this).css('your css property') == 'the expected value';
  }
).corner();

$ ( '[class]') 사용하는 것이 더 낫다고 생각합니다.

• 코딩 할 필요가 없습니다.
• 모든 HTML 요소를 하나씩 확인하지 않습니다.

여기에 예가 있습니다.

---

다음은 깨끗하고 이해하기 쉬운 솔루션입니다.

// find elements with jQuery with a specific CSS, then execute an action
$('.dom-class').each(function(index, el) {
    if ($(this).css('property') == 'value') {
        $(this).doThingsHere();
    }
});

이 솔루션은 코너, 필터 또는 리턴을 사용하지 않기 때문에 다릅니다. 더 많은 사용자를 위해 의도적으로 만들어졌습니다.

교체 할 항목 :

1. ".dom-class"를 선택기로 바꾸십시오.
2. CSS 속성과 값을 원하는 값으로 바꿉니다.
3. "doThingsHere ()"를 찾은 요소에서 실행하려는 항목으로 바꿉니다.

---

사용자 정의 CSS 속성은 상속되지 않으므로 각 요소에 직접 적용해야합니다 (js를 사용하여 속성을 동적으로 추가하는 경우에도 클래스를 추가하여 수행해야 함).

CSS

.Title
{
    color:red;
}

.Caption
{
    color:black;
}

HTML

rounded : true 속성을 전혀 정의 할 필요가 없습니다. 'Rounded'클래스의 존재를 사용하십시오.

<div class='Title Rounded'><h1>Title</h1></div>
<div class='Caption Rounded'>Caption</div>

JS

jQuery( '.Rounded' ).corner();

참고 URL : https://stackoverflow.com/questions/1220834/select-all-elements-that-have-a-specific-css-using-jquery