动态加载CSS和JS文件

Question

大家好日子。

我对动态加载CSS和JS文件有一些疑问。

我知道周围有很多这样的问题。但我关心的是：

我应该使用后端程序来加载CSS和JS吗？

示例：

if($page == "abc.com") {
    echo "<link href='abc.css' />";
else if($page == "def.com") {
    echo "<link href='def.css' />";
else {
    echo "<link href='ghi.css' />";
}

在特定页面中使用特定于函数加载的CSS，但它在＆lt; body＆gt;内部声明部分。

Dynamically Add CSS and JS File - CodeIgniter

在abc.com内部

add_css(array('metro-admin.css', 'abc.css'));  
echo put_headers();

源代码看起来像这样。

Answer 1

好的我有一个解决方案，而不是在PHP中明确声明css，让PHP回显一个<script>标记，以便PHP在前端不会过多地侵入。

if($page == "abc.com") {
    echo "<script src='abc.js'></script>";
else if($page == "def.com") {
    echo "<script src='def.js'></script>";
else {
    echo "<script src='ghi.js'></script>";
}

好的，PHP已经完成了，现在我们将在各个脚本文件中破解脚本执行。

- == ABC.JS === -

  var includeFiles = [ 
    'abc'
  ];

    for (var i = 0; i < includeFiles.length; i++) {
        $('head').append("<link rel='stylesheet' href=' +includeFiles[i]+ ".css'>");
    }

当然，您对每个文件应用相同的代码，这可能会在DRY上崩溃，但由于此脚本只有在明确回显时才会执行PHP，它不会重复，所以双方都存在争论。

为什么要使用ARRAY？可移植性，如果你想在每个页面添加多个CSS文件，那么只需简单地将CSS文件名添加到数组中，循环就会相应地接受它。