Javascript 插入Facebook登录按钮，innerHTML在Chrome中不起作用

我试图让我的网页对用户是否已经通过Facebook登录做出反应。当他们登录时，我希望“使用Facebook登录”按钮通常显示设置/注销按钮的位置。如果使用未登录，我希望它显示Facebook登录按钮

我必须这样做的代码如下所示，我使用innerHTML来设置我想要的内容

var login_area = document.getElementById("login-area");
if (response.status === 'connected') {
  // Logged into your app and Facebook.
  user_id = response.authResponse.userID;
  login_area.innerHTML = '<button type="button" class="btn btn-outline-danger btn-sm" onclick="settings()"><i class="fas fa-cog fa-lg"></i></button><button id="login-button" type="button" class="btn btn-outline-danger btn-sm" onclick="logout()"><i class="fa fa-sign-out-alt fa-lg" aria-hidden="true"></i></button>';
} else {
  // The person is not logged into your app or we are unable to tell.
  login_area.innerHTML = '<div class="fb-login-button" data-max-rows="1" data-size="medium" data-button-type="continue_with" data-show-faces="false" data-auto-logout-link="false" scope="user_friends" data-use-continue-as="false"></div>';
}

var login_area=document.getElementById（“登录区域”）；
如果（response.status===“已连接”）{
//登录你的应用程序和Facebook。
user_id=response.authResponse.userID；
login_area.innerHTML=''；
}否则{
//此人未登录到您的应用程序，或者我们无法确定。
login_area.innerHTML=''；
}

这段代码的工作原理与Firefox完全相同，但对于Chrome，登录按钮不显示。当我去检查元素时，它就在那里，但它在实际页面上没有显示任何内容

---

发生了什么事？

因为Facebook SDK不知道您在文档中添加了新标记。您必须使用FB.XFBML.parse（）告诉Facebook SDK关于它的信息