如何使用 jQuery 为 AJAX 内容动态应用内联或外部 CSS？

使用 jQuery 动态应用内联或外部 CSS

使用 jQuery 将 Ajax 内容集成到页面中时，有必要管理所应用的 CSS到该内容。本文探讨了应用内联 CSS 或动态加载外部 CSS 样式表的方法，以确保正确呈现加载的内容。

问题

使用以下方式将 Ajax 内容加载到 Yahoo 弹出窗口中jQuery 的 .get 方法会导致应用动态生成的 CSS 时出现问题。 Chrome 不会评估内联添加到 DOM 的 CSS，但 Internet Explorer 会评估。找到一种方法来评估动态加载的CSS，无论是内联还是外部加载都是至关重要的。

解决方案

jQuery 提供了几种动态加载和评估 CSS 的方法：

加载内联 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");

使用动态创建的加载外部 CSS

$('<style type="text/css"></style>')
    .html('@import url("' + myStylesLocation + '")')
    .appendTo("head");

$('<style type="text/css">@import url("' + myStylesLocation + '")</style>')
    .appendTo("head");

这些方法允许动态加载和评估异步加载内容的 CSS，确保向用户正确设置样式并呈现加载的内容。

以上是如何使用 jQuery 为 AJAX 内容动态应用内联或外部 CSS？的详细内容。更多信息请关注PHP中文网其他相关文章！