如何应用通过jQuery动态加载的内联和/或外部CSS

Question

我有一个使用jQuery加载到Yahoo弹出窗口中的Ajax控件。

我只是使用一个简单的.get请求来加载HTML。

  $.get(contentUrl, null, function(response) {
         $('#dialog').find('.bd').assertOne().html(response);
     }, "waitDlg");

现在的问题是，加载的内容需要自己的CSS，而CSS实际上是动态创建的。我可以选择内联或使用外部CSS样式表。

在Chrome中进行的测试表明，使用上述代码将通过AJAX加载的css添加到DOM时未进行评估/应用。

当Internet
Explorer仅停留在DOM中时，它将评估内联的CSS，但Chrome不会。由于完全不相关的问题，我目前无法在FireFox中进行测试。

jQuery是否有任何方法可以评估以内联或动态添加到DOM的样式表？

我想这样做的原因有很多：

• 弹出窗口中的css属于弹出窗口，并且可能完全来自不同的环境
• 它是动态的，除非绝对必要，否则我不想将其放在父页面中
• 我计划它像这样工作，但事实并非如此！:-(

Answer 1

给定样式表的路径（或 一些 将生成有效CSS的URL）：

var myStylesLocation = "myStyles.css";

…其中任何一种都可以工作：

使用AJAX加载

$.get(myStylesLocation, function(css)
{
   $('<style type="text/css"></style>')
      .html(css)
      .appendTo("head");
});

使用动态创建的 加载

$('<link rel="stylesheet" type="text/css" href="'+myStylesLocation+'" >')
   .appendTo("head");

使用动态创建的