Скрипт не запускается в IE после отложенного анализа JavaScript - PullRequest
1 голос
/ 20 августа 2011

Чтобы оптимизировать свои страницы, я хотел отложить анализ javascript. Я поместил приведенный ниже код для своего блока в стиле Facebook в верхнюю часть моей страницы:

<script type="text/javascript">
 function downloadJSAtOnload() {
   var element = document.createElement("script");
   element.src = "http://connect.facebook.net/en_US/all.js#xfbml=1";
   document.body.appendChild(element); 
 } 
 if (window.addEventListener)
 window.addEventListener("load", downloadJSAtOnload, false);
 else if (window.attachEvent)
 window.attachEvent("onload", downloadJSAtOnload);
 else window.onload = downloadJSAtOnload;
</script>

Теперь работает хорошо в Google Chrome и Mozilla, но не отображает поле «Мне нравится» в INternet Explorer.

Пожалуйста, как мне исправить

Ответы [ 2 ]

0 голосов
/ 20 августа 2011

Обновление:

После того, как я прочитал справочник разработчика Facebook .Я сделал для вас демо .Вы также можете отредактировать код по адресу http: //jsbin.com/onehul/17/edit.

По сути, вам нужно добавить пространство имен XML в html documentElement

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">

Это гарантирует, что браузер примет и проанализирует нестандартный тег из facebook, а затем динамически создаст тег сценария, добавляющий к fb-root div.finally, выполните очистку.После успешной загрузки сценария удалите его из дерева dom.

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <div id="fb-root">
  </div>
  <script>

  var script,
    head = document.head || document.getElementsByTagName( "head" )[0] || document.documentElement;

script = document.createElement( "script" );
script.async = "async";
script.charset = "utf-8";
script.src = "http://connect.facebook.net/en_US/all.js#xfbml=1";

// Attach handlers for all browsers
script.onload = script.onreadystatechange = function() {

    if (!script.readyState || /loaded|complete/.test( script.readyState ) ) {

         // Handle memory leak in IE
        script.onload = script.onreadystatechange = null;

        // Remove the script
        if ( head && script.parentNode ) {
            head.removeChild( script );
        }

        // Dereference the script
        script = undefined;
   }
};

// Use insertBefore instead of appendChild  to circumvent an IE6 bug.
// This arises when a base node is used (#2709 and #4378).
    document.getElementById('fb-root').appendChild(script);
  </script>

  <fb:like-box href="http://facebook.com/pages/MyJobMag/165211540158300" width="336" show_faces="false" stream="false" header="true" colorscheme="light"></fb:like-box>
</body>
</html>

Приведенный ниже код заимствован и изменен из исходного кода jquery для динамической загрузки сценария, который должен работать во всех браузерах

var script,
    head = document.head || document.getElementsByTagName( "head" )[0] || document.documentElement;

script = document.createElement( "script" );
script.async = "async";
script.charset = "YOUR SCRIPT CHARSET";
script.src = "YOUR SCRIPT SRC";

// Attach handlers for all browsers
script.onload = script.onreadystatechange = function() {

    if (!script.readyState || /loaded|complete/.test( script.readyState ) ) {

         // Handle memory leak in IE
        script.onload = script.onreadystatechange = null;

        // Remove the script
        if ( head && script.parentNode ) {
            head.removeChild( script );
        }

        // Dereference the script
        script = undefined;

   };
}

// Use insertBefore instead of appendChild  to circumvent an IE6 bug.
// This arises when a base node is used (#2709 and #4378).
head.insertBefore( script, head.firstChild );
0 голосов
/ 20 августа 2011

Все загрузчики скриптов, которые я видел, добавляют элемент script к первому тегу head, а не тег body, как показано в этом описании .

   var head = document.getElementsByTagName('head')[0];
   var script = document.createElement('script');
   script.type = 'text/javascript';
   script.src = 'http://connect.facebook.net/en_US/all.js#xfbml=1';
   head.appendChild(script);

I can 'Скажите, если это является причиной вашей проблемы в IE, но, похоже, стоит изменить на.

Кроме того, поскольку вы ожидаете события загрузки окна, понимаете ли вы, что этот скрипт не будет загруженпока последнее изображение на странице не закончило загрузку.Это намного дольше, чем нужно ждать.

Как я могу сказать, IE просто не работает, если скрипт FB загружается после загрузки контента.Даже если вы поместите его после содержимого в традиционный тег сценария, он не будет работать в IE.Должно быть что-то о том, как скрипт Facebook работает в IE.Извините, я не могу помочь больше.Вы можете видеть, что даже в IE8 это не работает:

<div id="fb-root"></div><fb:like-box href="http://facebook.com/pages/MyJobMag/165211540158300" width="336" show_faces="false" stream="false" header="true" colorscheme="light"></fb:like-box>

<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>

Но в IE8 это работает:

PS У вас есть лишняя точка с запятой вВаш HTML после URL, но его удаление, похоже, не решит проблему.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...