Загрузка скриптов после загрузки страницы?

Question

Загрузка скриптов после загрузки страницы?

Я работаю с рекламной компанией, где мы помечаем определенные страницы для отслеживания активности. Мой клиент хочет запустить тег javascript для отслеживания активности после того, как страница полностью загрузится (чтобы предотвратить медленную загрузку содержимого страницы из-за медленного времени загрузки тега).

Пример тега, который должен загрузиться после полной загрузки страницы:

<script>document.write('<s'+'cript language="JavaScript" src="http://jact.atdmt.com/jaction/JavaScriptTest"></s'+'cript>')</script>

Я смотрел на некоторые потоки stackoverflow и наткнулся на нижеприведенную реализацию, которая, я думаю, будет работа:

window.onload = function(){

  <script language="JavaScript" src="http://jact.atdmt.com/jaction/JavaScriptTest"></script>

};

Я проверил это на своей собственной веб-странице, и я действительно получил тег, чтобы выстрелить, но мне интересно, есть ли какие-либо альтернативные или более надежные методы, в идеале с помощью jquery какого-то вида.

Ниже приведен пример реализации, которую пытался выполнить клиент, но она, похоже, нарушает их страницу:

<script>

jQuery(window).load(function () {$('<script language="JavaScript" src="http://jact.atdmt.com/jaction/JavaScriptTest"></script>').insertAfter('#div_name');});

</script>

Я уже давно не делал JQuery и надеялся, что смогу получить какой-то вклад от других участников. Есть ли другой способ, которым я могу вызвать приведенный выше скрипт после загрузки страницы с помощью В jQuery?

Спасибо,

724 5

jQuery javascript

5 ответов:

Comments

Ничего не найдено.

jfriend00 · Accepted Answer · 2013-11-02 01:32:59

Итак, это никак не работает:
window.onload = function(){
  <script language="JavaScript" src="http://jact.atdmt.com/jaction/JavaScriptTest"></script>
};
Вы не можете свободно поместить HTML в середину javascript.

Если у вас есть jQuery, вы можете просто использовать:
$.getScript("http://jact.atdmt.com/jaction/JavaScriptTest")
Когда захочешь. Если вы хотите убедиться, что загрузка документа завершена, вы можете сделать следующее:
$(document).ready(function() {
    $.getScript("http://jact.atdmt.com/jaction/JavaScriptTest");
});
В обычном javascript вы можете загрузить скрипт динамически в любое время, когда вам это нужно:
var tag = document.createElement("script");
tag.src = "http://jact.atdmt.com/jaction/JavaScriptTest";
document.getElementsByTagName("head")[0].appendChild(tag);

Johannes H. · Accepted Answer · 2016-12-10 23:41:27

Второй подход является правильным для выполнения кода JavaScript после завершения загрузки страницы - но вы на самом деле не выполняете код JavaScript там, вы вставили простой HTML.
Первое, что работает, но загружает JavaScript сразу и очищает страницу (так что ваш тег будет там - но больше ничего).
(Плюс: language= "javascript"был устаревшим в течение многих лет, используйте type=" text/javascript " вместо этого!)

Чтобы заставить это работать, вы должны использовать методы манипулирования DOM включено в JavaScript. В основном вам понадобится что-то вроде этого:
var scriptElement=document.createElement('script');
scriptElement.type = 'text/javascript';
scriptElement.src = filename;
document.head.appendChild(scriptElement);

CPHPython · Accepted Answer · 2018-06-05 11:58:10

Фокусируясь на одном из решений jQueryпринятого ответа , $.getScript() является ли .ajax() запрос в маскировке . Это позволяет выполнить другую функцию на успех, добавив второй параметр:
$.getScript(url, function() {console.log('loaded script!')})
Или на самих обработчиках запроса, т. е. успех (.done() - скрипт был загружен) или сбой (.fail()):
$.getScript(
    "https://code.jquery.com/color/jquery.color.js",
    () => console.log('loaded script!')
  ).done((script,textStatus ) => {
    console.log( textStatus );
    $(".block").animate({backgroundColor: "green"}, 1000);
  }).fail(( jqxhr, settings, exception ) => {
    console.log(exception + ': ' + jqxhr.status);
  }
);
.block {background-color: blue;width: 50vw;height: 50vh;margin: 1rem;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="block"></div>

Vô Vị · Accepted Answer · 2018-01-26 11:02:01

<script type="text/javascript">
$(window).bind("load", function() { 

// your javascript event

)};
</script>

tagfriend · Accepted Answer · 2014-05-18 20:35:47

Это тег JS действия Atlas. Поставщик должен был предоставить клиенту некоторые документы с рекомендациями по внедрению тега на странице преобразования. Вы должны запросить у клиента эту документацию или контакт поставщика, чтобы запросить их напрямую.