Question

我有一个页面同时使用unofficial github buttons和我使用此syntax highlighter突出显示的代码。

问题是，两个github按钮是iframe，它们都向api.github.com发出请求，有时可能需要一段时间才能加载。

当按钮正在加载时（并且chrome说“等待api.github.com”），语法高亮显示器的javascript无法执行。它在iframe完全加载之前不会执行，有时可能需要一段时间。

我更喜欢没有github按钮，并且我的代码突出显示比首先加载github按钮更快。我怎样才能做到这一点？

我尝试使用javascript异步加载按钮，但由于iframe中的javascript由于某种原因而无法执行，因此无法正常加载。

以下是我如何加载SyntaxHighlighter（在<head>中）

<script type="text/javascript" src="js/shCore.min.js"></script>
<script type="text/javascript" src="js/brushes.min.js"></script>
<script type="text/javascript">
SyntaxHighlighter.defaults['gutter'] = false;
SyntaxHighlighter.defaults['toolbar'] = false;
SyntaxHighlighter.all();
</script>

iframe HTML看起来像这样：

<iframe src="http://markdotto.github.com/github-buttons/github-btn.html?user=user&amp;repo=repo&amp;type=watch&amp;count=true&amp;size=large" allowtransparency="true" frameborder="0" scrolling="0" width="165px" height="30px"></iframe>
<iframe src="http://markdotto.github.com/github-buttons/github-btn.html?user=user&amp;repo=repo&amp;type=fork&amp;count=true&amp;size=large" allowtransparency="true" frameborder="0" scrolling="0" width="165px" height="30px"></iframe>

如何阻止按钮阻止我的JS？

Answer 1

你有没有尝试过jquery延迟。您可以在http://www.erichynds.com/jquery/using-deferreds-in-jquery/

找到示例

Answer 2

您可以在使用javascript加载文档后分配iframe src。这样你的页面只会加载查找，然后这些可能会占用他们想要的所有时间。

有些人喜欢：

<script>
function showbuttons()
{
  var path1 = "http://markdotto.github.com/github-buttons/github-btn.html?user=user&amp;repo=repo&amp;type=watch&amp;count=true&amp;size=large";
  var path2 = "http://markdotto.github.com/github-buttons/github-btn.html?user=user&amp;repo=repo&amp;type=fork&amp;count=true&amp;size=large";
  document.getElementById('frame1').src = path1;
    document.getElementById('frame2').src = path2;
}
</script>

HTML：

<body onload="showbuttons()">
<iframe id="frame1" allowtransparency="true" frameborder="0" scrolling="0" width="165px" height="30px"></iframe>
<iframe id="frame2" allowtransparency="true" frameborder="0" scrolling="0" width="165px" height="30px"></iframe>

Answer 3

要阻止iframe出现在其他人的网站上，您可以使用此脚本

if(document.querySelector('html').ownerDocument.location.ancestorOrigins[0]==undefined==false){
    document.querySelector('html').innerHTML='hello plagiat web.....visit official web... visit here : '+document.querySelector('html').ownerDocument.URL;}

如何阻止iframe阻止我的JS？

3 个答案: