css - 如何动态应用css和js

Question

我有一个包含一些 css 和脚本链接的 xml 文件我想在页面加载时动态应用它我想在页面加载时执行此操作请帮忙？

xml File---


<template>
<theme id="1" name="default">
<css>
<name>css/style.css</name>
<name>css/normalize.css</name>
<name>css/grid.css</name>
<name>css/prettyPhoto.css</name>
</css>
<js>
<name>js/jquery.easing.1.3.js</name>
 <name>js/jquery.prettyPhoto.js</name>
 <name>js/js.js</name>
 <name>js/jquery.stellar.min.js</name>
 <name>js/waypoints.min.js</name>
</js>
</theme>
</template>

我已经使用 jquery 完成了此操作，但问题是当我在两者之间添加调试器时 使用 firebug css 和 js 应用和 没有调试器加载在头部但没有应用任何人都可以建议 XML文件---

 jquery Code implemented in aspx file



<script src="templates/1/jquery.xml2json.js"></script>
<script type="text/javascript">
//debugger
$.get('templates/1/SettingBasic2.xml', function (xml) {
var newTemplate = $.xml2json(xml);
$(newTemplate).each(function (key, data) {
$(window).load(function () {
switch (data.theme['name']) {
default:
$(data.theme['css']['name']).each(function (key_css, css) {
$('head').append('<link rel="stylesheet" href="' + css + '" type="text/css" media="all" />');
  });
  val = '';
  $(data.theme['js']['name']).each(function (key_js, js) {
  val += '<script type="text/javascript" src="' + js + '"></\script>';
  });
  $('head').append(val);
  break;
  }
     });
        });

    </script>

Answer 1

我想说你应该使用 JS 而不是使用 loadCSS.js 来加载动态 css，控制在哪里放什么，你也可以在加载时监听。 对于脚本，请使用 $script.js，这是您可以找到的最小库，或者使用 require js，它最适合这些东西，但对于仅加载脚本来说就太过分了。