기본 js는 노드appendChild, insertBefore를 추가합니다.

PHPz
풀어 주다: 2018-10-10 15:11:48
앞으로
3400명이 탐색했습니다.

1. createElement()는 요소 노드를 생성합니다
var element=document.createElement('요소 이름');

2. crateTextNode()는 텍스트 노드를 생성합니다
var txt=document.crateTextNode('text content');

3. createAttribute()는 속성 노드를 생성합니다
var attr =document.createAttribute('attribute name');
attr.value='attribute value';

4.appendChild() 메소드는 노드에 마지막 하위 노드를 추가합니다
다음과 같습니다:

<p id="box" class="classa">
    <p id="p1">这是一个段落</p></p><script>
    var box=document.getElementById("box");    var p2=document.createElement("p");  //创建元素节点
    var txt=document.createTextNode("这是另一个段落"); //创建文本节点
    p2.appendChild(txt); //把创建的文本节点追加到元素节点中
    var attr=document.createAttribute("id"); //创建属性节点
    attr.value="p2"; //给属性节点设置值
    p2.setAttributeNode(attr); //给元素设置属性节点
    box.appendChild(p2);  //把创建的p元素追加到box最后
    console.log(box);</script>
로그인 후 복사

결과는 다음과 같습니다.

<p id="box" class="classa">
    <p id="p1">这是一个段落</p>
    <p id="p2">这是另一个段落</p></p>
로그인 후 복사

5. insertBefore()는 지정된 하위 노드 앞에 새 하위 노드를 삽입합니다.
parent .insertBefore(newChild,oldChild);
은 다음과 같습니다.

<p id="box">
    <p id="p1">这是一个段落</p></p><script>
    var box=document.getElementById("box");    var p1=document.getElementById("p1");    var p0=document.createElement("p");    var txt=document.createTextNode("这是一个段落");
    p0.appendChild(txt);
    box.insertBefore(p0,p1);
    console.log(box);</script>
로그인 후 복사

결과는 다음과 같습니다.

<p id="box">
    <p>这是一个新段落</p>
    <p id="p1">这是一个段落</p></p>
로그인 후 복사

자세한 관련 튜토리얼은 , JavaScript 비디오 튜토리얼을 방문하세요.

원천:csdn.net
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿