动态改变SCRIPT SRC客户端

Question

我有一个包含一个HTML页：

• 一个<select>下拉带有3个选项与onchange事件到一个JS函数
• 与内部的脚本元件的DIV持有人：

下面的代码：

<select onChange="getData(this.value);"> 
    <option value="-">Limba/Language</option> 
    <option value="ro">Romana</option> 
    <option value="en">Engleza</option> 
</select> 
<div id="output"> 
    <script id="widget" type="text/javascript" src="js1.js"></script> 
</div> 

而这里的JS功能：

<script type="text/javascript"> 
function getData(title) 
{ 
    switch(title) 
    { 
     case "ro": 
      var s = document.createElement("script"); 
       s.type = "text/javascript"; 
       s.src = "js1.js"; 
       s.innerHTML = null; 
       s.id = "widget"; 
       document.getElementById("output").innerHTML = s; 
     break; 
     case "en": 
      var s = document.createElement("script"); 
       s.type = "text/javascript"; 
       s.src = "js2.js"; 
       s.innerHTML = null; 
       s.id = "widget"; 
       document.getElementById("output").innerHTML = s; 
     break; 
     default: 
     void(0); 
    } 
} 
</script> 

当我选择选项2或3，我得到这个输出在我的浏览器：[object HTMLScriptElement]

我想要做的就是切换基于选择的值script标签的src属性下拉元素。 我想这样做的客户端，最好没有任何外部库...

Answer 1

另一种方案是伟大的:) ......但如果你仍然想创建通过JavaScript元素，你应该使用的appendChild而不是innerHTML的...

这里是你的JavaScript应该是什么:)

<script type="text/javascript"> 
function getData(title) 
{ 
    switch(title) 
    { 
     case "ro": 
      var s = document.createElement("script"); 
       s.type = "text/javascript"; 
       s.src = "js1.js"; 
       s.innerHTML = null; 
       s.id = "widget"; 
       document.getElementById("output").innerHTML = ""; 
       document.getElementById("output").appendChild(s); 
     break; 
     case "en": 
      var s = document.createElement("script"); 
       s.type = "text/javascript"; 
       s.src = "js2.js"; 
       s.innerHTML = null; 
       s.id = "widget"; 
       document.getElementById("output").innerHTML = ""; 
       document.getElementById("output").appendChild(s); 
     break; 
     default: 
     void(0); 
    } 
} 
</script> 

Answer 2

做简单：

function getData(title) { 
    switch(title) { 
     case "ro": 
      document.getElementById("output").innerHTML = '<script id="widget" type="text/javascript" src="js1.js" />'; 
      break; 
     case "en": 
      document.getElementById("output").innerHTML = '<script id="widget" type="text/javascript" src="js2.js" />'; 
      break; 
     default: 
      void(0); 
    } 
} 

Answer 3

function getData(title){ 
    document.getElementById("widget").src= (title == "ro" || title == "-") ? "js1.js" : "js2.js"; 
}