我正在尝试将类似Facebook的按钮和Twitter关注按钮集成到我的网络应用程序中。
我对此有点困惑。我为facebook创建了一个DOM元素,并按下twitter按钮并附加到html.It工作正常。
但是我想在特定的div中附加facebook和twitter跟随按钮。
var fbroot = document.createElement('div');
fbroot.id = 'fb-root';
document.body.appendChild(fbroot);
var fbscript = document.createElement('script');
fbscript.src = 'https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js';
document.head.appendChild(fbscript);
var twitterscript = document.createElement('script');
twitterscript.src = 'https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.min.js';
document.head.appendChild(twitterscript);
var social_likes = document.createElement('div');
social_likes.id = 'social_like';
document.body.appendChild(social_likes);
var facebook = document.createElement('div');
facebook.setAttribute("class", "fb-like");
facebook.setAttribute("data-href", "https://developers.facebook.com/docs/plugins/");
facebook.setAttribute("data-layout", "button");
facebook.setAttribute("data-action", "like");
facebook.setAttribute("data-size", "large");
facebook.setAttribute("data-show-faces", "true");
facebook.setAttribute("data-share", "false");
document.body.appendChild(facebook);
var twitter = document.createElement('a');
twitter.setAttribute("href", "http://twitter.com/TwitterDev");
twitter.setAttribute("class", "twitter-follow-button");
twitter.setAttribute("data-size", "large");
twitter.setAttribute("data-show-count", "false");
document.body.appendChild(twitter);
window.fbAsyncInit = function() {
FB.Event.subscribe('edge.create', function(response) {
alert('You liked the URL: ' + response);
});
FB.Event.subscribe('edge.remove', function(response) {
alert('You unliked the URL: ' + response);
});
};
(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 = "https://connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v2.10&appId=115700475727068";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
<!-- //twitter javascript SDK -->
window.twttr = (function(d, s, id) {
var t, js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s);
js.id = id;
js.src = "//platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js, fjs);
return window.twttr || (t = {
_e: [],
ready: function(f) {
t._e.push(f)
}
});
}(document, "script", "twitter-wjs"));
twttr.ready(function(twttr) {
twttr.events.bind('follow', function(e) {
alert("FOLLOW!");
});
});
我正在尝试将社交插件附加到这样的特定div上。
document.getElementById("demo").appendChild(social_likes);
它成功附加,但我没有看到div中的社交插件。我无法找到我错误的做法。