如何使用Javascript插入Facebook登录按钮？

Question

我想使用Javascript在我的HTML页面上添加一个Facebook登录按钮：

var button = document.createElement("fb:login-button");
button.size = "xlarge";
parent.appendChild(button);

该按钮出现，并且可以成功添加非Facebook特定的属性，例如id和lang 。 但是，添加size属性无效。

另外，如果我尝试使用button.createAttribute()添加任何属性，我会得到

未捕获的TypeError：对象＃ <HTMLUnknownElement>没有方法'createAttribute'

为什么Facebook的登录按钮即使出现在页面上也不能识别为有效的HTML元素？ 使用Java脚本插入Facebook登录按钮并更改其大小的正确方法是什么？

Answer 1

您将需要Facebook JavaScript SDK来动态呈现这些社交插件。 初始化SDK后，您可以随意操作所有页面，然后只需调用FB.XFBML.parse()函数，即可正确显示标签。

您甚至可以在特定元素上调用该函数以进行更多控制：

FB.XFBML.parse( document.getElementById( 'some-element' ) );
// or with jQuery
FB.XFBML.parse( $( "#some-element" )[0] )

您还应该尝试将标记手动添加为字符串：

element.innerHTML += '<fb:login-button id="some-element" size="xlarge"/>'; 
FB.XFBML.parse( document.getElementById( 'some-element' ) );

---

以下是相关文档的概述：

此函数可动态解析并呈现文档中的XFBML标记 。 如果您通过ajax从服务器发送XFBML并希望在客户端呈现它，则可以使用此方法。 XFBML使您能够将FBML整合到您的网站和IFrame应用程序中。

您可以使用此方法解析以下XFBML标签：

• FB：活动
• FB：评论
• FB：friendpile
• FB：像
• FB：像盒
• fb：登录按钮 <-------------- ^哇！
• FB：名称
• FB：型材PIC
• FB：建议