몇 가지 기본 jquery 선택기

기본 선택자는 jQuery에서 가장 일반적으로 사용되는 선택자이자 가장 간단한 선택자이기도 합니다. 요소 ID, 클래스 및 태그 이름을 통해 DOM 요소를 찾습니다.

id selector
id selector $('#id')는 주어진 ID를 가진 요소와 일치하고 단일 요소를 반환합니다.

<p id="test">测试元素</p><script>//选择id为test的元素并设置其字体颜色为红色$(&#39;#test&#39;).css(&#39;color&#39;,&#39;red&#39;);</script>

는 jQuery 처리에서 내부적으로 사용되는 DOM의 getElementById() 메서드에 해당합니다. ID 획득

document.getElementById('test').style.color = 'red';

Element selector
Element selector $('element')는 주어진 요소 이름에 따라 요소를 일치시키고 조건에 맞는 요소 집합을 반환합니다

<p>1</p>
<p>2</p>
<script>//选择标签名为p的元素并设置其字体颜色为红色$(&#39;p&#39;).css(&#39;color&#39;,&#39;red&#39;);
</script>

는 DOM의 getElementsByTagName() 메서드에 해당합니다. , 그리고 이 메서드는 요소 이름 획득을 처리하기 위해 jQuery에서 내부적으로도 사용됩니다

Array.prototype.forEach.call(document.getElementsByTagName('p'),function(item,index,arr){
    item.style.color = 'red';
});

클래스 선택기
클래스 선택기 $('.class')는 주어진 클래스 이름에 따라 요소를 일치시키고 조건을 충족하는 집합 요소를 반환합니다. 조건

<p class="test">1</p>
<p class="test">2</p>
<script>//选择class为test的元素并设置其字体颜色为红色$(&#39;.test&#39;).css(&#39;color&#39;,&#39;red&#39;);
</script>

DOM의 getElementsByClassName() 메서드에 해당하며 jQuery도 내부적으로 이 메서드를 사용하여 클래스 이름 획득을 처리합니다.

Array.prototype.forEach.call(document.getElementsByClassName('test'),function(item,index,arr){
    item.style.color = 'red';
});

와일드카드 선택기
와일드카드 선택기 $('*')는 클래스 이름의 모든 요소와 일치합니다. 문서 및 반환 컬렉션 요소

$('*').css('margin','0');

는 DOM

Array.prototype.forEach.call(document.all,function(item,index,arr){
    item.style.margin = 0;});

의 document.all 컬렉션 또는 getElementsByTagName() 메서드

Array.prototype.forEach.call(document.getElementsByTagName('*'),function(item,index,arr){
    item.style.margin = 0;});

그룹 선택기
그룹 선택기 $('selector1,selector2,...'에 해당합니다. ) 매개변수는 와일드카드 * 각 선택기와 일치하는 요소는 함께 병합되며 컬렉션 요소

<p class="a">1</p>
<span id="b">2</span>
<a href="#">3</a><script>//选择符合条件的元素并设置其字体颜色为红色$(&#39;.a,#b,a&#39;).css(&#39;color&#39;,&#39;red&#39;);
</script>

는 DOM

Array.prototype.forEach.call(document.querySelectorAll('.a,#b,a'),function(item,index,arr){
    item.style.color = 'red';
});

의 querySelectorAll() 선택기에 해당합니다.

위 내용은 몇 가지 기본 jquery 선택기의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!