반응형
특정 클래스가없는 요소를 선택하는 방법
jQuery가 아닌 JavaScript를 사용하여 특정 클래스가없는 요소를 선택하는 방법이 궁금합니다.
예를 들어 다음 목록이 있습니다.
<ul id="tasks">
<li class="completed selected">One Task</li>
<li>Two Task</li>
</ul>
다음과 같이 완료된 작업을 선택합니다.
var completeTask = document.querySelector("li.completed.selected");
하지만 그런 클래스가없는 목록 항목을 선택하는 방법을 모르겠습니다.
두 번째 LI요소가 선택 됩니다.
document.querySelector("li:not([class])")
또는
document.querySelector("li:not(.completed):not(.selected)")
예:
// select li which doesn't have a 'class' attribute...
console.log(document.querySelector("li:not([class])"))
// select li which doesn't have a '.completed' and a '.selected' class...
console.log(document.querySelector("li:not(.completed):not(.selected)"))
<ul id="tasks">
<li class="completed selected">One Task</li>
<li>Two Task</li>
</ul>
선택하려면 <li>되지 않았 음 completed이나 selected클래스를 :
document.querySelector("li:not(.completed):not(.selected)");
깡깡이
:not()선택기를 사용해 볼 수 있습니다.
var completeTask = document.querySelector("li:not(.completed):not(.selected)");
document.querySelectorAll('[wf-body=details] input:not(.switch):not(.btn)').forEach(function(e){
// do whatever you want. with 'e' as element :P
});
대신 부모의 자식 배열을 가져 오십시오.
var completeTask = document.querySelector("#tasks").childNodes;
그런 다음 필요에 따라 반복 / 검색합니다.
참고 URL : https://stackoverflow.com/questions/21975881/how-to-select-element-that-does-not-have-specific-class
반응형
'Nice programing' 카테고리의 다른 글
| C # 컨트롤러에서 외부 URL로 리디렉션하는 방법 (0) | 2020.11.07 |
|---|---|
| jQuery를 사용하여 테이블의 tbody에 행 추가 (0) | 2020.11.07 |
| Ajax 응답에서 반환 된 JavaScript 함수 호출 (0) | 2020.11.07 |
| C # GUI 명명 규칙에 대한 모범 사례? (0) | 2020.11.07 |
| 유니 코드 코드 포인트를 지정하는 데 'U +'가 사용되는 이유는 무엇입니까? (0) | 2020.11.07 |