Bookmarklet not working

Bookmarklet not working

本文关键字：working not Bookmarklet      更新时间：2023-09-26

我正在创建一个bookmarklet，它可以在head的页面中插入facebook的all.js，但它也不能正常工作，没有错误，这里是：

javascript: (function() {
    var msg = '';
    if (typeof window.FB == 'object') {
        msg = 'Already Facebookified';
    } else {
        var js = document.createElement('script');
        js.id = 'facebook-jssdk';
        js.async = true;
        js.src = "http://connect.facebook.net/en_US/all.js";
        document.getElementsByTagName('head')[0].appendChild(js);
        msg = (typeof window.FB == 'object' ? 'Facebookified': 'Unable to Facebookify');
    }
    alert(msg);
})();

有人能指出它可能出了什么问题吗？

尝试异步加载脚本时会出现一些常见错误。这个代码应该工作：

function loadScript(src, callback) {
  var s,
      r;
  s = document.createElement('script');
  s.src = src;
  s.onload = s.onreadystatechange = function () {
/**
 * LOAD/READYSTATE LOGIC
 * execute if the script hasn't been ready yet and:
 * - the ready state isn't set
 * - the ready state is complete
 *   - note: readyState == 'loaded' executes before the script gets called so
 *     we skip this event because it wouldn't have loaded the init event yet.
 */
    if (!r && (!this.readyState || this.readyState === 'complete')) {
      //set the ready flag to true to keep the event from initializing again
      r = true;
      callback();
    }
  };
  document.body.appendChild(s);
}

您可以将其用作：

loadScript('http://connect.facebook.net/en_US/all.js', function () {console.log(window.FB)}

您可能希望在加载Facebook JS-SDK并添加fb-root节点（某些功能需要）后使用window.fbAsyncInit来运行代码：

javascript: (function() {
  var msg = '';
  if (typeof window.FB == 'object') {
    alert('Already Facebookified');
  } else {
    window.fbAsyncInit = function(){
      alert('JS-SDK loaded');
    };
    var d = document,
        js = d.createElement('script'),
        root_node = d.createElement('div');
    js.id = 'facebook-jssdk';
    js.async = true;
    js.src = "//connect.facebook.net/en_US/all.js";
    root_node.id = 'fb-root';
    d.getElementsByTagName('body')[0].appendChild(root_node);
    d.getElementsByTagName('head')[0].appendChild(js);
  }
})();

正如zzzzBov所指出的，您需要"监听"脚本才能完成加载。为此，脚本元素至少有两个事件可以挂接（onreadystatechange和onload）。您可以按如下方式设置它们：

javascript: (function() {
    var isFacebookified = function () {
        return typeof window.FB === 'object';
    };
    var scriptIsDoneLoading = function () {
        var msg = (isFacebookified ? 'Facebookified': 'Unable to Facebookify');
        alert(msg);
    };
    if (isFacebookified()) {
        alert('Already Facebookified');
    } else {
        var js = document.createElement('script');
        js.id = 'facebook-jssdk';
        js.async = true;
        js.src = "http://connect.facebook.net/en_US/all.js";
        js.onreadystatechange = scriptIsDoneLoading;
        js.onload = scriptIsDoneLoading;
        document.getElementsByTagName('head')[0].appendChild(js);
    }
})();

脚本加载完成后，您应该收到警报。

希望这能有所帮助，

Pete

相关文章：