檢查css ref鏈接是否存在，然後再添加一個

我將一個.css文件動態添加到頁面。如果.css文件已經在鏈接中，這有什麼關係嗎？我如何檢查鏈接是否已經存在，我想用javascript檢查頭部。這是怎麼了追加類：檢查css ref鏈接是否存在，然後再添加一個

<script type="text/javascript"> 
(function(){ 
    var AppendNewStyle = document.createElement("link"); 
    AppendNewStyle.setAttribute("href", "/Content/Extras.css"); 
    AppendNewStyle.setAttribute("rel", "stylesheet"); 
    AppendNewStyle.setAttribute("type", "text/css"); 
    $('head')[0].appendChild(AppendNewStyle); 
})(); 
</script>

我可以拋出一個檢查在這裏查看該文件是否已經在頭或者我應該只是不擔心有兩個鏈接？

來源

2012-05-18 Travis J

您應該能夠像其他任何元素一樣查詢這些鏈接元素。由於您使用jQuery：如果你這樣做的腳本標記是下面其中的鏈接

var myLink = $('link[href="' + url +'"]'); //Find the link that matches your URL

：

var allLinks = $("link");

此外，你可以使用屬性選擇器來找到您所關心的鏈接標籤應該是，你不應該有任何時間問題。

2017-04編輯：

模板文字讓這甚至yummier！

var myLink = $(`link[href="${url}"]`)

而對於所有你jQuery的仇敵在那裏：

var myLinks = document.querySelectorAll(`link[href="${url}"]`)

來源

2012-05-18 01:20:03

鏈接元素上有load event的模糊支持，對於error event更差。雖然可以用這種方式動態加載它，但這種方法並不可靠。

動態加載CSS樣式的唯一可靠方法是通過AJAX利用AJAX成功和失敗事件並在成功的AJAX之後添加鏈接。

至於已經加載的樣式，你可以檢查所有鏈接元素的所有URL，並將它們與要加載的CSS進行比較。

var links = document.getElementsByTagName('link'), 
    linksLen = links.length, 
    i; 

for(i=0;i<linksLen;i++){ 
    if(links[i].href.indexOf(urlToLoad) !== -1){ 
     //found 
    } 
}

來源

2012-05-18 01:00:37 Joseph

我使用簡單的方法來檢查CSS文件已經存在，如果沒有，那麼通過對CSS鏈接提供ID加載

var cssSelector = document.getElementById("uiCss"); 

    // Load UI CSS file 
    if (!cssSelector) { 
     var filename = 'http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css'; 
     var fileref = document.createElement("link"); 
     fileref.setAttribute("href", filename); 
     fileref.setAttribute("rel", "stylesheet"); 
     fileref.setAttribute("type", "text/css"); 
     fileref.setAttribute("ID", "uiCss"); 
     document.getElementsByTagName("head")[0].appendChild(fileref); 
    }

來源

2013-08-21 13:46:43

檢查css ref鏈接是否存在，然後再添加一個

回答

相關問題