JS動態新增樣式和指令碼

2022-02-12 09:42:44 字數 1095 閱讀 1614

在ie下style和script是特殊的元素,dom無法訪問其子節點,所以指令碼和樣式的動態生成需要考慮對ie的特殊處理

對於樣式,如果內容較少,或者不想放到檔案中,可以使用dom.style.csstext來批量設定。

style

//

載入樣式內容

function

loadstyle(styletext)

catch(e)}//

載入樣式檔案

function

loadstylefile(url)

loadstyle("*");

loadstylefile("../css/common.css");

script

動態載入指令碼內容

//

現在很多情況下都會需要按需載入指令碼檔案,所以動態載入指令碼還是比較有意義的

//載入指令碼內容

function

loadscript(scripttext)

catch (e)

document.body

}loadscript("function test()");

動態載入指令碼檔案時,涉及到乙個載入結束後**函式的問題

在ff,chrome,高版本ie(9+)中,script的dom物件是支援onload和onerror方法的,但是ie7,ie8則不支援

具體解決方式是利用onreadystatechange來監聽檔案載入狀態的變化。

script.onreadystatechange = function

() }

此時 readystate 的值  可能為 以下幾個 :

整理之後 檔案動態載入的方法如下

//

載入指令碼檔案

function

loadscriptfile(url, callback)

} else

}}loadscriptfile("/scripts/jquery.min.js", somefunction);

部分內容引自

16 js動態新增樣式

有兩種方式 div.setattribute style font size 44px 一次新增多個 div.style.color white style.樣式名 樣式值 function test1 預設好兩個樣式 然後js改變class屬性值為準備好的樣式 就好了。也有兩種修改class屬性值...

原生js動態新增樣式表

原生js給html動態新增樣式表 1.建立標籤新增一張內建樣式表 var style1 document.createelement style style1.innerhtml body top hover 2.另一種是新增外部樣式表,即在文件中新增乙個link節點,然後將href屬性指向外部樣式...

給動態元素動態新增樣式

工作上乙個問題,我在ul的容器裡動態新增li標籤,如果給固定樣式的話完全沒問題。但是我想給li動態新增樣式,除了ajax外,我想用jq實現,但是一直不知道怎麼實現。我知道有幾種方法,可以給動態元素新增樣式的,例如我用jquery裡面的load方法載入進了test.html入index.html裡面的...