Question

我正在使用flikr徽章代码（http://www.flickr.com/badge_code_v2.gne）

<!-- Start of Flickr Badge -->
<div id="flickr_badge_uber_wrapper">
<script type="text/javascript" src="http://www.flickr.com/badge_code_v2.gne?..."></script>
<p class="clear"><a href="http://www.flickr.com/photos/..." target="_blank" rel="external">see more...</a></p>
</div>
<!-- End of Flickr Badge -->

这很好用，除了它靠近页面的顶部，flikr api偶尔会挂起网站的其余部分。为了阻止这一点，我想我可以将html移动到页面的底部，并使用一些额外的CSS来设计我希望它去的地方，或者使用一些javascript来使其稍后加载。前者听起来有点太多绝对定位，而我有点困惑如何去做后者。

通常这很容易，例如：

document.onload = function() {
   // Do something
}

但是如何使用flickr徽章代码，它是动态生成的JavaScript的链接？

修改

来自链接的来源即js拉入：

var b_txt = '';

// write the badge

b_txt+= // some html, b_txt+= called for each image.

b_txt += '<span style="position:absolute;left:-999em;top:-999em;visibility:hidden" class="flickr_badge_beacon"><img src="http://geo.yahoo.com/p?s=792600102&t=53dd558c54466a104f77d195043a008d&r=http%3A%2F%2Flocalhost%3A8000%2F&fl_ev=0&lang=en&intl=uk" width="0" height="0" alt="" /></span>';

document.write(b_txt);

Answer 1

使用占位符<div>最终显示的位置。然后使用jquery $(document).ready并将占位符div的innerHTML设置为span / img / script标记。将脚本标记放在身体末端附近，它将最后加载。当一切都完成加载后，将触发document.ready

像这样的东西

$(document).ready(
     function(){
          $("#placeholder").innerHTML("<script/span/img>");
});

Answer 2

一个简单的解决方案是将脚本标记从包装器中拉出来。将flickr_badge_uber_wrapper置于您想要的位置，然后将javascript src调用放在正文的末尾。我没有看到为什么javascript无法从包装器中提取并在页面加载后加载的原因。这应该是让您的网页不被搁置的最简单方法。

页面加载后执行flickr徽章代码

2 个答案: