Question

我有以下使用远程github存储库加载css文件的代码：

document.addEventListener('DOMContentLoaded', function() {

$.ajax({

url: 'www.websitehere.css',

success: function(css) {

$("<style></style>").appendTo('head').html(css);

}

});

为防止不断从我不拥有的远程存储库中加载，我想加载自己的CSS文件。我已经创建了一个名为mytheme.css的文件，该文件已与js文件保存在同一文件夹中，并尝试使用以下代码进行调用。

document.addEventListener('DOMContentLoaded', function() {

$.ajax({

// url: 'www.websitehere.css',

success: function(css) {

    $('head').append('<link rel="stylesheet" href="mytheme.css" type="text/css" />');

}

});

但是，这不起作用，有没有办法在事件侦听器中加载本地CSS文件。

Answer 1

如果有人和我有同样的问题，这是答案：

document.addEventListener('DOMContentLoaded', function() {
  var fs = require('fs'),
  filePath = '/foo/bar/baz/mytheme.css';

  fs.readFile(filePath, {encoding: 'utf-8'}, function(err, data) {
    if (!err) {
      var css = document.createElement('style')
      css.innerText = data;
      document.getElementsByTagName('head')[0].appendChild(css);
    }
  })

在事件侦听器函数中加载本地CSS文件

1 个答案: