如何使用 jQuery 动态加载和应用 CSS？

使用 jQuery 动态加载和应用 CSS

您有一个 Ajax 控件动态加载到 Yahoo 弹出窗口中，并且它需要自己的 CSS正确的渲染。但是，您面临一个问题，即使用简单的 .get 请求将 CSS 添加到 DOM 时，不会评估 CSS。

内联 CSS 与外部 CSS

您可以选择内联 CSS 或使用外部 CSS 样式表。这两种方法都可以使用 jQuery 动态加载。

加载内联 CSS

要内联 CSS，您可以创建一个

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

加载外部 CSS

要加载外部 CSS 样式表，您可以创建一个 元素并将其附加到

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

使用 @Import 加载 CSS

或者，您可以使用 @import 规则加载 CSS stylesheet:

// Using a dynamically-created <style> element
$('<style type="text/css"></style>').html('@import url("'+cssUrl+'")').appendTo("head");

// Or, using a <style> element with inline @import rule
$('<style type="text/css">@import url("'+cssUrl+'")</style>').appendTo("head");

通过使用这些方法中的任何一个，您可以动态加载 CSS 并将其应用到DOM，确保您的 Ajax 内容具有适当的样式。

以上是如何使用 jQuery 动态加载和应用 CSS？的详细内容。更多信息请关注PHP中文网其他相关文章！