Question

簡要地說，我想在互聯網上（不是在我的網站上）加載引導程序css文件web page，在瀏覽器控制檯中使用Javascript對其進行一些自定義。

我試圖使用jQuery像這樣從CDN加載引導：

$("head").append("<link rel='stylesheet' href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css' type='text/css' />"); 

如果這樣做，我收到此錯誤信息：

我應該怎麼做才能成功加載到頁面？

Answer 1

在這裏你去：

var mySheet = document.createElement('link');mySheet.type='text/css';mySheet.rel='stylesheet';mySheet.href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css';document.getElementsByTagName('head')[0].appendChild(mySheet); 

粘貼在上面的代碼DevTools - >控制檯，按Enter鍵，你是好去。

，這裏的要點是首先創建HTML標記，用性能填滿它，並把它添加到DOM的

Answer 2

這爲我工作：

var head = document.head; 
var link = document.createElement('link'); 



link.type = 'text/css'; 


link.rel = 'stylesheet'; 


link.href = fileName/url; 



head.appendChild(link); 

Answer 3

從JS的角度來看你的做法是正確的。您試圖從另一個站點加載腳本，並且因爲您通過內容安全策略（CSP）限制了此腳本，所以您不能。檢查您的CSP元標籤。

我建議你閱讀更多關於它in this MDN article.

要簡單地讓所有只是爲了測試，如果依然出現，您可以使用此：對如何詳細解釋

<meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-inline' 'unsafe-eval'"> 

檢查this answer此標籤作品

順便說一句，這適用於我：

function loadCss(filename) { 
 
    var cssNode = document.createElement("link"); 
 
    cssNode.setAttribute("rel", "stylesheet"); 
 
    cssNode.setAttribute("type", "text/css"); 
 
    cssNode.setAttribute("href", filename); 
 
    document.getElementsByTagName("head")[0].appendChild(cssNode); 
 
} 
 

 
loadCss("//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css")