Question

我正试图通过this method

将推文嵌入我的网站

但我无法理解这是我的HTML标记

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body>
<blockquote class="twitter-tweet" lang="en">
  <p lang="en" dir="ltr">Can you answer this? Tem como calcular a diagonal no Canvas? <a href="http://t.co/E8dD01jGKX">http://t.co/E8dD01jGKX</a> <a href="https://twitter.com/hashtag/javascript?src=hash">#javascript</a></p>
  &mdash; SO em Português (@StackOverflowPT) <a href="https://twitter.com/StackOverflowPT/status/613791039539806208">June 24, 2015</a></blockquote>
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
</body>
</html>

我在浏览器中看到的就是： enter image description here 仅仅是html，而不是Twitter嵌入式推文框的风格。

请帮忙。

Answer 1

Twitter widgets.js的链接是所谓的协议相对或无方案：它没有定义自己的URI scheme并使用其主机页面发生的任何内容打开。这对于支持http和https方案非常有用，无需更改源代码中的链接。

现在，因为您正在使用本地文件进行测试，所使用的方案为file，即specifically created用于与浏览器位于同一台计算机上的文件。因此，无协议//platform.twitter.com/widgets.js获取file方案，并成为widgets.js文件夹中本地文件platform.twitter.com的链接，这可能是您不具备的机。

要解决此问题，只需添加一个方案，http或https，如下所示：

<!DOCTYPE html>
<html>

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>Untitled Document</title>
</head>

<body>
  <blockquote class="twitter-tweet" lang="en">
    <p lang="en" dir="ltr">Can you answer this? Tem como calcular a diagonal no Canvas? <a href="http://t.co/E8dD01jGKX">http://t.co/E8dD01jGKX</a>  <a href="https://twitter.com/hashtag/javascript?src=hash">#javascript</a>
    </p>
    &mdash; SO em Português (@StackOverflowPT) <a href="https://twitter.com/StackOverflowPT/status/613791039539806208">June 24, 2015</a>
  </blockquote>
  <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
  <!--                 ^                -->
</body>

</html>

无法将推文嵌入HTML

1 个答案: