动态更改脚本源不起作用

我有两个文件。HTML 文件:


<!DOCTYPE html>

<html>

    <head>

        <script type="text/javascript">

function update_layout()

{

    var new_source = document.createElement('script')

    new_source.src = 'script_code.js'

    new_source.type = 'text/javascript'

    document.getElementsByTagName('head')[0].appendChild(new_source)

}

function do_layout()

{

    alert(Lay_Table['nam'])

}

        </script>

    </head>

    <body>

        <input type="button" value="Update" onclick="update_layout();do_layout();"/>

    </body>

</html>

和一个名为“script_code.js”的 JavaScript 文件:


Lay_Table = {}

Lay_Table['nam'] = 'US 104 Key'

当我单击“更新”按钮时,我收到错误,而不是包含文本“US 104 Key”的警报。


我在 Stack Overflow 上查看过非常类似的问题,但无法找出问题所在。我是否犯了一个错误,或者由于安全原因不再允许使用此方法?我正在使用谷歌浏览器。


慕莱坞森
浏览 61回答 1
1回答

三国纷争

该脚本需要一些时间才能插入到文档中并运行 - 它不会立即发生,因此Lay_Table在运行时没有及时定义do_layout。load考虑向插入的标签添加一个侦听器(并避免内联处理程序,它们现在有太多不值得使用的问题,例如疯狂的作用域链和引用转义问题):window.addEventListener('DOMContentLoaded', () => {  document.querySelector('input').addEventListener('click', update_layout);});function update_layout(){    var new_source = document.createElement('script')    new_source.src = 'script_code.js'    new_source.addEventListener('load', do_layout);    document.head.appendChild(new_source)}
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript