JS簡單添加元素新節點的方法樣本,js元素節點樣本

來源:互聯網
上載者:User

JS簡單添加元素新節點的方法樣本,js元素節點樣本

本文執行個體講述了JS簡單添加元素新節點的方法。分享給大家供大家參考,具體如下:

<!DOCTYPE html><html lang="en"><head>  <meta charset="UTF-8">  <title>www.jb51.net - JS添加新節點的幾種方法</title></head><body><div id="d"><span id="s">  1234567890</span></div></body><script type="text/javascript">  //首先找到Id為d的元素  var d=document.getElementById('d');  //建立一個節點  var a=document.createElement('a');  //設定a的屬性  a.href='https://www.baidu.com/';  a.innerText='ggggg';  //添加元素  將建立的節點添加到Id為d的div裡  d.appendChild(a);  //在指定節點前插入新節點  var p=document.createElement('p');  //添加常值內容  p.innerText='ppppppppppppppppp';  //d.appendChild(p);  //參數1:要添加的元素 參數2:要放到哪個節點的前面  d.insertBefore(p,a);  //擷取目標元素  var s=document.getElementById('s');  //複製新元素  var spanc= s.cloneNode(true);//預設參數是false  d.appendChild(spanc);</script></html>

運行效果:

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.