如何找到動態創建的<style> element

Question

我正在使用javascript創建<style>元素，如下所示：

function createMyStyle(selector , rule) {
   j$("head").append('<style type="text/css">' + selector + '{' + rule + '}' + '</style>');
}

我不想每次都創建此元素，而是要查找是否已插入此<style>元素，然后使用類似的內容向其中添加規則：

if( stylesheet.addRule ) {
    stylesheet.addRule(selector, rule);
} 
else if( stylesheet.insertRule ) {
    stylesheet.insertRule(selector + ' { ' + rule + ' }', stylesheet.cssRules.length);
}

我用一個片段而不是用純DOM來創建此<style> ，因為IE無法對document.createElement（'style'）進行innerHTML處理。

我試圖給<style>一個id並做類似...

for( var i in document.styleSheets ) {
    if( !document.styleSheets[i].id) {

但這無法完成，因為沒有id屬性。

Answer 1

嘗試使用jQuery做類似的事情：

if($("style").length > 0){
  // this means you have a style  element in your document
}

Answer 2

給它一個ID 應該工作。

$('head').append('<style id="some-id"> ... </style>');

console.log($('#some-id'));

但是，如果您不知道， 可以使用更簡單的方法在jQuery中添加和刪除文檔中的樣式。