如何把js代碼動態添加到的後面（js動態添加html代碼）

本文目錄一覽：

• 1、用原生js怎麼動態添加一個js文件
• 2、javascript如何把節點 插入到指定的節點後?
• 3、如何用js在頁面中添加元素？

用原生js怎麼動態添加一個js文件

如果需要用原生js動態的加載另外一個js文件，可以使用原生js的document.createElement方法創建script節點，然後更改該節點的type和src屬性,最後通過appendChild方法將該節點動態添加到html中，這樣就可以了，參考代碼如下：

var new_element = document.createElement(“script”);//創建新的script節點new_element.setAttribute(“type”, “text/javascript”);new_element.setAttribute(“src”, “../js/jquery.js”);document.body.appendChild(new_element);//添加到body節點的末尾

上例中是在body的最末尾添加的，當然同樣可以在head中添加引用該js的標籤：document.head.appendChild(new_element);

javascript如何把節點 插入到指定的節點後?

在那個id=”name”的input上，加onblur=”checkEmpty(this.id)”

把”(在這插入labe標籤)”換成span id=”nameSpan”請輸入用戶名/span

然後在文件尾加一段JS代碼

script

function checkEmpty(id)

{

var tar=document.getElementById(id);

if(tar.value==””)

{

tar.focus();

tar=document.getElementById(id+”Span”);

tar.innerHTML=”用戶名不能為空！”;

}

}

/script

如何用js在頁面中添加元素？

1.首先創建html結構，如下圖所示，一個input元素，一個按鈕，一個空的ul列表。

2.然後添加按鈕點擊事件，如下圖所示，在按鈕點擊事件中獲得input元素。

3.通過value屬性我們可以獲得用戶在input中輸入的內容，如下圖所示。

4.下面我們來動態創建一個li元素，如下圖所示，運用document中的createElement方法即可。

5.創建好li元素以後，下面要做的就是給其設置innerHTML內容，如下圖所示。

6.接下來就是獲取ul元素了，如下圖所示，仍然用getElementById方法。

7.最後通過調用appendChild方法將創建的li元素添加到ul列表中，如下圖所示。