0

我得到了 facebook 为类似按钮插件代码自动生成的功能。但是，我不太确定函数中的变量，如果有人帮助我找出每个变量的含义，我将不胜感激。

该html函数从以下位置收集数据：

    <div class="fb-like" data-href="https://www.facebook.com/yanntiersen.official"   
data-send="true" data-width="450" data-show-faces="true" data-font="arial"></div>

实际的javascript函数：

<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1&appId=123456789";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

我看到这个函数被调用了(document, 'script', 'facebook-jssdk')，但我真的不明白事情是如何工作的。谁能给我解释一下，好吗？

4

4 回答 4

3 
(function ( d , s , id) {

}(document, 'script', 'facebook-jssdk));

将意味着以下情况为真

d = document;
s = 'script';
id = 'facebook-jssdk';

有了这些知识

// Get the first <script> tag in the document
var fjs = document.getElementsByTagName(s)[0]

// Return void from this function if '#facebook-jssdk' exists
if ( document.getElementById('facebook-jssdk') ) return ;

// Create a new script tag
var js = d.createElement(s)

// Assign the id to the script tag
js.id = id;

// Assign a source to load asyncrounously into this tag
js.src = '//connect...';

// Insert the script element into the DOM BEFORE the first script tag
fjs.parentNode.insertBefore( js , fjs )

希望有帮助

于 2013-03-16T17:00:56.183 回答
2 
//Create a function taking arguments `d`, `s` and `id`
(function(d, s, id) {

    //Initialise variable js, initialise variable fjs to the first element with the tag 
    //name s
    var js, fjs = d.getElementsByTagName(s)[0];

    //If the element with id = id exists already, escape from the function.
    if (d.getElementById(id)) return;

    //Create a new element of type s ('script') and set it's id to id ('facebookjssdk')
    js = d.createElement(s); js.id = id;

    //Set the script's src attribute to the path specified.
    js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1&appId=123456789";

    //Insert the new element immediately before the first <script> on the page.
    fjs.parentNode.insertBefore(js, fjs);

//Call the function immediately with document for d, 'script' for s and 'facebook-jssdk' 
//for id.
}(document, 'script', 'facebook-jssdk'));

如果您不熟悉该模式(function () {})();，它只是一个封装其代码并按照定义调用自身的函数。

于 2013-03-16T17:00:28.613 回答
2

基本上它是这样做的：

Gets the first "<script>" element in the document
If an object exists with the id of "facebook-jssdk" than
    return (dont process the rest of the code)
EndIf
Create a "<script>" element
Set the new "<script>" element's id to 'facebook-jssdk'
Set the new "<script>" element's src location to "//connect.facebook.net/en_GB/all.js#xfbml=1&appId=123456789"
(this loads a javascript file from facebook's server onto the client)
Insert the new "<script>" tag before the first "<script>" tag in the page

希望有帮助:)

于 2013-03-16T17:03:46.003 回答
1

该脚本正在查找标记名为“script”的元素，然后获取对第一个脚本对象的引用。

然后它会查找 id 为“facebook-jssdk”的元素。如果它找到这个 id，它就会停止处理。

然后它创建一个新的脚本标签，将 id 设置为“facebook-jssdk”，将源设置为“//connect.facebook.net/en_GB/all.js#xfbml=1&appId=123456789”，并在第一个之前插入脚本页面上的脚本。

于 2013-03-16T16:58:01.487 回答