jquery - 如何在head中添加或删除js文件

Question

假设我有 3 种语言：en, tc, sc, 我想达到以下条件

1）当当前为en时，添加en.js到head并删除js文件tc.js并sc.js在head

2）当当前为tc时，添加tc.js到head并删除js文件sc.js并en.js在head

3）当当前为sc时，添加sc.js到head并删除js文件tc.js并en.js在head

有人可以建议如何在 jQuery 中做到这一点吗？

谢谢

Answer 1

这是一个快速函数，可以根据语言参数动态加载脚本。

addLanguageScript = function(lang) {
    var head = document.getElementsByTagName("head")[0],
        script = document.createElement('script');

    script.type = 'text/javascript'
    script.src = lang + '.js'
    head.appendChild(script);
};

addLanguageScript('en');

要删除文件，您可以在 jQuery 中执行类似的操作，但请记住，如果加载的脚本可能已经产生了一些效果。

$("script[src='en.js']").remove()

Answer 2

document加载后，您无法动态执行此操作。但是有一个脚本require.js，它是一个 JavaScript 文件和模块加载器。

它针对浏览器内使用进行了优化，但也可以在其他 JavaScript 环境中使用，例如 Rhino 和 Node。使用像 RequireJS 这样的模块化脚本加载器将提高代码的速度和质量。

它很好地支持将它与 jQuery一起使用。您可能还想在页面加载后动态加载代码。查看上面的链接，它肯定会针对您的问题。

Answer 3

为什么首先要删除文件？如果它们在页眉中，则意味着它们已经被执行。

使用 Yesnope JS 模块加载器，解决方案将如下所示：

yepnope({
  test : lang=="en",
  yep : ['en.js']
});

http://yepnopejs.com/

顺便说一句，这个模块加载器用于 Modernizr。

Answer 4

在 head 部分动态添加和删除文件

function loadjscssfile(filename, filetype){
 if (filetype=="js"){ //if filename is a external JavaScript file
  var fileref=document.createElement('script')
  fileref.setAttribute("type","text/javascript")
  fileref.setAttribute("src", filename)
 }
 else if (filetype=="css"){ //if filename is an external CSS file
  var fileref=document.createElement("link")
  fileref.setAttribute("rel", "stylesheet")
  fileref.setAttribute("type", "text/css")
  fileref.setAttribute("href", filename)
 }
 if (typeof fileref!="undefined")
  document.getElementsByTagName("head")[0].appendChild(fileref)
}

调用函数：

loadjscssfile("myscript.js", "js") //dynamically load and add this .js file
loadjscssfile("javascript.php", "js") //dynamically load "javascript.php" as a JavaScript file
loadjscssfile("mystyle.css", "css") ////dynamically load and add this .css file

删除：

 $('head script[src*="en.js"]').remove();  // for removing dynamically     
  $('head script[src*="en.js"]').append();   // for append dynamically