>웹 프론트엔드 >JS 튜토리얼 >지정된 장소에 HTML 콘텐츠와 텍스트 콘텐츠를 삽입하는 방법_javascript 기술

지정된 장소에 HTML 콘텐츠와 텍스트 콘텐츠를 삽입하는 방법_javascript 기술

WBOY
WBOY원래의
2016-05-16 17:07:451772검색

dhtml은 insertAdjacentHTML과 insertAdjacentText라는 두 가지 추가 메서드를 제공합니다.
insertAdjacentHTML 메서드: 지정된 위치에 html 태그 문을 삽입합니다.
프로토타입: insertAdjacentHTML(swhere,stext)
매개변수:
swhere: html 태그 문이 삽입되는 위치를 지정합니다. 사용 가능한 값은 4개입니다.
1.beforeBegin: 시작 전에 삽입합니다. of the tag
2.afterBegin: 태그 시작 태그 뒤에 삽입
3.beforeEnd: 태그 끝 태그 앞에 삽입
4.afterEnd: 태그 끝 태그 뒤에 삽입
stext: 내용 삽입됨
예 :

코드 복사 코드는 다음과 같습니다.

var sHTML= "<입력 유형=버튼 go2 ()" " value='Click Me'>
"
var sScript=' >


insertAdjacentText 메소드는 일반 텍스트만 삽입할 수 있고 동일한 매개변수를 갖는다는 점을 제외하면 insertAdjacentHTML 메소드와 유사합니다.

이 두 속성은 매우 유사합니다. 특히 도면 및 기타 장소에서 더 많이 사용됩니다. 장점 원본 콘텐츠를 덮어쓰지 않습니다. 이제 원본을 덮어쓰지 않고 콘텐츠를 동적으로 추가해야 합니다. 따라서 현재 이 항목은 매우 중요하므로 innerHTML은 원래 항목을 덮어씁니다.
쌍으로 나타나는 모든 HTML은 ...,
...
와 같이 innerHTML과 동일한 이 속성을 사용할 수 있습니다.

추가하자면: 방금 시도했는데 innerHTML 속성이 읽기 및 쓰기 가능하다는 것을 예전에는 innerHTML이 노드에 콘텐츠를 삽입할 수 있다는 것을 알고 있었지만 이 속성도 읽기 가능합니다. 즉, innerHTML에 저장된 내용은 노드의 HTML 콘텐츠입니다. 완전히 이해하려면 다음 코드를 살펴보세요.

코드 복사 코드는 다음과 같습니다.


< ;title>제목 없는 문서


safdsdaf 시간 장소




다른 사람에게 전달한 코드를 아래에 몇 줄 더 추가하겠습니다. 이 코드도 매우 고전적일 수 있습니다.


코드 복사 코드는 다음과 같습니다.