jquery 및 DOM 노드 작업 방법 및 속성 레코드 정보

不言
풀어 주다: 2018-07-02 15:34:20
원래의
1423명이 탐색했습니다.

다음은 jquery와 DOM 노드 연산 방법 및 속성 레코드에 대한 글입니다. 에디터가 꽤 좋다고 생각해서 지금 공유해서 참고용으로 올려보겠습니다

온라인에서 jquery의 노드 작업 방법 목록을 찾았습니다. 다음과 같습니다:

요약은 다음과 같습니다. 위의 방법을 사용한 후 두 노드는 동일한 수준의 형제 노드가 됩니다.다음은 DOM에서 노드를 작동하는 방법을 요약한 것입니다.//someNode의 childNodes 목록 끝에 newNode 추가var returnNode = someNode.appendChild(newNode);var returnNode = someNode .appendChild(someNode.firstChild);(2)insertBefore 메소드를 사용하면 childNodes 목록의 특정 위치에 노드를 배치할 수 있습니다returnedNode = someNode. insertBefore(newNode , null);//appendChild와 동일한 효과//삽입 후 첫 번째 자식 노드가 됩니다

method

소스 패키징 세트/문자열

대상 포장 집단

기능 설명

A.append(B )

B

A

대상 포장 세트가 하나의 요소만 일치하는 경우 소스(동종 포장 세트와 일치하는 모든 요소 포함)는 다음으로 이동됩니다. target location ;대상 래퍼 세트에 여러 요소가 포함된 경우 소스는 원래 위치에 유지되지만 동일한 복사본이 대상 위치에 복사됩니다.

따라서 대상이 하나의 요소에만 일치하는 경우 위 방법을 사용한 후에 소스가 삭제됩니다. A .이전(B)

B.insertBefore(A)

A.after(B)

B.insertAfter(A)

예: 위 표에서 A. Append(B)는 A와 일치하는 모든 요소의 기존 콘텐츠에 B를 추가하는 것을 의미하므로 B는 소스이고 A는 대상 래퍼 세트입니다.

(1)appendChild 방법, childNodes 목록 끝에 노드 추가

//someNode의 첫 번째 하위 노드를 마지막 하위 노드로 변경

//삽입 후 마지막 자식 노드가 됩니다

returnedNode = someNode.insertBefor(newNode, someNode.firstChild);

(3)replaceChild 메서드를 사용하여 하위 노드 교체, 삽입할 하위 노드와 교체할 하위 노드라는 두 개의 매개변수를 허용합니다. 교체될 자식 노드는 문서 트리에서 제거되고 그 위치는 삽입될 자식 노드가 차지하게 됩니다

//첫 번째 자식 노드 교체

returnedNode = someNode.replaceChild(newNode, someNode.firstChild) ;

(4) RemoveChild 메소드는 하위 노드를 제거하는 데 사용됩니다

//첫 번째 하위 노드 제거

var formFirstChild = someNode.removeChild(someNode.firstChild);

한 문장으로 요약하면 위의 메소드는 다음과 같습니다. 모든 부모 노드 자식 노드 운영

다음 그림은 아버지, 아들, 형제 노드 간의 검색 관계를 보여줍니다.

위 내용은 모두의 학습에 도움이 되기를 바랍니다. 내용이 있으니 PHP 중국어 홈페이지를 주목해주세요!

관련 권장 사항:

JQuery를 사용하여 WordPress에 @ ID 부동 디스플레이 구현하여 댓글 내용 표시

Ajax 부트스트랩은 웹 페이지를 아름답게 하고 페이지 로드, 삭제 및 세부 정보 보기를 위한 코드를 구현합니다.

위 내용은 jquery 및 DOM 노드 작업 방법 및 속성 레코드 정보의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!