dom 노드에 대한 jquery의 작업 [권장]_jquery

1. 자바스크립트 스크립트는 어디에 넣어야 하나요?

1. 일부 함수를 실행하기 전에 호출해야 하거나 일부 이벤트를 실행하기 전에 트리거해야 하는 경우 HTML의 헤드 부분에 스크립트를 배치하여 스크립트가 실행되기 전에 로드되도록 할 수 있습니다. 부르다.

2. 페이지가 로드되면 실행할 스크립트를 HTML의 본문 부분에 배치할 수 있습니다. 이러한 유형의 스크립트는 일반적으로 페이지의 콘텐츠를 생성하는 데 사용됩니다.

3. 페이지가 로드된 후 즉시 실행해야 하는 스크립트의 경우 끝에 배치하고 문서가 로드된 후에 실행할 수 있습니다. 다행히 Jquery에는 이벤트 제어 기능이 있으므로 이 부분에서는 head가 참조하는 외부 파일을 다운로드할 수 있습니다.

2.jquery의 공통 기능

예: children(), parent(), Each(), text(), html(), val(), next()

<ul class="level-1"> 

<li class="item-i">I</li> 

<li class="item-ii">II 

<ul class="level-2"> 

<li class="item-a">A</li> 

<li class="item-b">B 

<ul class="level-3"> 

<li class="item-1">1</li> 

<li class="item-2">2</li> 

<li class="item-3">3</li> 

</ul> 

</li> 

<li class="item-c">C</li> 

</ul> 

</li> 

<li class="item-iii">III</li> 

</ul>

아, 아이들()

DOM 트리를 순회하고 지정된 요소의 직접 하위 노드를 검색합니다. 이 방법은 DOM 트리에서 한 수준 아래로만 순회합니다.

// jquery 

$('ul.level-2').children().css('background-color', 'red'); 

$('ul.level-2').children('.item-*').css('background-color', 'red');

b、부모()

DOM 트리를 위쪽으로 탐색하여 지정된 각 요소의 직접 상위 요소를 검색합니다. 이 순회 범위는 한 수준을 순회하는 children() 함수와 동일합니다.

$('li.item-a').parent().css('배경색', '빨간색')

c,각()

컬렉션의 각 요소를 반복합니다.

//数组的遍历 

var arr = ["Test1", "Test2", "Test3"]; 

$.each(arr, function (i, item) { 

alert(i); 

alert(item); 

}); //二维数组的遍历 

var arr = [ 

["Test1", "Test2", "Test3"], 

["Test4", "Test5", "Test6"], 

["Test7", "Test8", "Test9"] 

]; 

$.each(arr, function (i, item) { 

alert(i); 

alert(item); 

}); //遍历json数据 

var obj = { "1": "Test1", "2": "Test2", "3": "Test3", "4": "Test4", "5": "Test5", "6": "Test6" }; 

$.each(obj, function (i, item) { 

alert(i); 

alert(item); 

});

4. 텍스트() 함수

text()는 지정된 요소의 텍스트 콘텐츠에 액세스하는 데 사용되는 jquery 객체의 메서드입니다. 지정된 요소의 텍스트 내용을 결합하여 문자열로 반환합니다. 과제에 사용할 수 있습니다.

5. html() 함수

지정된 요소의 첫 번째 요소에서 html 콘텐츠를 가져와 문자열로 반환합니다. 과제에 사용할 수 있습니다.

차이점: text()와 html() 함수의 차이점

차이점 1: text() 함수는 xml 문서와 html 문서에 모두 사용할 수 있고, html() 함수는 html 문서에만 사용할 수 있습니다.

차이점 2: html() 함수는 텍스트를 표시할 뿐만 아니라 태그 쌍과 텍스트도 출력하는 반면, text()에는 텍스트만 있습니다.

6. val() 함수　

선택한 요소의 값을 반환하거나 설정합니다. 요소의 값은 value 속성을 통해 설정됩니다. 이 방법은 주로 입력 요소에 사용됩니다. 이 메서드가 매개변수를 설정하지 않으면 선택한 요소의 현재 값을 반환합니다.

7. next() 함수 일치하는 요소 집합에서 각 요소의 인접한 형제 요소를 가져옵니다. 선택기가 제공되면 선택기와 일치하는 다음 형제 요소를 검색합니다.

3. 돔 운영

예: prepend(), prependTo(), clone(),append(),appendTo(), before(), insertBefore(), after(), insertAfter(),remove(), detach(), 비어 있음 () , replacementWith() , replacementAll() , Wrap() , WrapAll() , warpInner()

위의 dom 노드에서의 jquery 작업 [권장]은 편집자가 공유한 모든 내용이므로 참고가 되셨으면 좋겠습니다. Script Home을 지원해 주시길 바랍니다.