无法从动态加载的脚本中读取DOM属性

Question

像下面的脚本一样，在HTML中静态包含一个脚本：

<script type="text/javascript" src="http://meerkatapp.co/widgets/embed.js" data-mute="false" data-social="false" data-cover="default" data-type="square" data-username="jessicadelfino"></script>

但是，动态调用脚本不起作用。

JavaScript代码：

    // Create script object
    var script = document.createElement("script");

    // Configure script with Meerkat data
    script.type = "text/javascript";
    script.src = "http://meerkatapp.co/widgets/embed.js";
    script.setAttribute("data-mute", "false");
    script.setAttribute("data-social", "false");
    script.setAttribute("data-cover", "default");
    script.setAttribute("data-type", "square");
    script.setAttribute("data-username", "jessicadelfino");

    // Append script object
    $("body").append(script);

这是发生错误的地方（来自http://meerkatapp.co/widgets/embed.js ）：

window.currentScript = document.currentScript || (function() {
  var scripts = document.getElementsByTagName('script');
  return scripts[scripts.length - 1];
})();

main(window.currentScript)

function main(currentScript) {
      ...
      var btnContainerElm = currentScript
      var mkBtnUsername = btnContainerElm.getAttribute("data-username")
      ...
      mkBtnUsername = mkBtnUsername.replace("@", '')

此代码生成错误： Uncaught TypeError: Cannot read property 'replace' of null在行mkBtnUsername = mkBtnUsername.replace("@", '').上Uncaught TypeError: Cannot read property 'replace' of null mkBtnUsername = mkBtnUsername.replace("@", '').

显然，即使在脚本中设置了data-username属性，也未设置mkBtnUsername 。

Answer 1

我的猜测是document.currentScript可能为null （如果在事件处理程序中检查该属性，例如$(document).ready ，则可能会发生这种情况），而您的后备函数选择了错误的脚本（ scripts[scripts.length - 1] ）。 尝试登录window.currentScript 。