javascript - 如何通过从用户输入中获取用户值来动态更改脚本 src？

Question

我正在尝试动态更改 <script src=oldValue"/> InputValue 取决于用户在输入中键入的内容，提交页面后将重新加载新的 <script src=newValue"/>

<input type="text" id="text" />
<input type="button" id="btn" value="Submit" onClick="javascript: window.open('http://www.mywebsite.com/print/' + document.getElementById('text').value);" />


<script src="//script.ashx?company=InputValue" async></script>

Answer 1

第一个示例更改了 script 元素的 src 属性。第二个例子是插入一个新的脚本元素。我不知道在你的情况下什么最有效。

第一个例子：

document.forms.test.addEventListener('submit', e => {
  e.preventDefault();
  var new_script = e.target.script.value;
  var script_elm = document.scripts.customscript;
  script_elm.src = `/script.ashx?company=${new_script}`;
  console.log(script_elm);
});

<form name="test">
  <input name="script" type="text" />
  <button>Add script</button>
</form>
<script name="customscript" async></script>

第二个例子：

document.forms.test.addEventListener('submit', e => {
  e.preventDefault();
  var script_elm = document.createElement('script');
  script_elm.async = true;
  script_elm.innerText = 'function testing(){alert("testing")};';
  document.body.append(script_elm);
  testing();
});

<form name="test">
<button>Add script</button>
</form>