Метод хорошей практики для загрузки JavaScript через ajax

Question

Отказ от ответственности: я довольно новичок в AJAX!

Я посмотрел вокруг и не уверен, какой метод использовать для загрузки javascript с использованием ajax.

Я использую ajax для запроса страниц, каждая из которых требует своих собственных 6-10 коротких методов. Всего может быть 5-6 таких страниц, так что всего около 35+ методов.

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

Я видел несколько методов, и я не уверен, какой из них лучше всего соответствует моим потребностям:

1. Включите пустой элемент script в заголовок и управляйте атрибутом src с помощью. ДОМ.

2. Создать новый элемент скрипта с помощью. DOM и добавьте его в document.body (звучит так же, как # 1).

3. В jQuery (который я уже использую) есть метод getScript () ajax.
4. Я ничего не читал об этом, но могу ли я просто включить элемент script как часть ответа ajax?

Поскольку я новичок в ajax и веб-разработке в целом, мне любопытно узнать о взлетах и ​​падениях каждого метода, а также о любых методах, которые я пропустил.

Некоторые проблемы: -Будет ли использоваться кэшированная копия или скрипт будет загружаться каждый раз, когда будет сделан запрос ajax. Обратите внимание, что сценарии будут статичными. Совместимость браузера. Я использую Chrome, но это приложение будет использоваться в версиях IE> = 7 и Firefox.

Answer 1

В среде jQuery я бы использовал getscript(). Вы правы, задаваясь вопросом о кеше - getscript включает в себя функцию уничтожения кеша (разработанную, главным образом, для победы над агрессивным кешированием IE, хотя, конечно, полезно в других сценариях). Вы можете выполнить эквивалент getscript без кэш-памяти, например:

$.ajax({
    cache: true,
    dataType: "script",
    url: "your_js_file.js",
    success: yourFunction
});

Answer 2

Поскольку все остальные ответы здесь просто говорят "использовать jquery" без какой-либо дополнительной информации / объяснения / обоснования, вероятно, стоит взглянуть на другие варианты, которые вы упомянули.

• Вариант № 1

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

• Вариант № 2

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

• Вариант № 3

  Рекомендовано всеми до меня, хорошо, если вы находитесь в среде jQuery и уже загружаете (довольно тяжелую) библиотеку jQuery для других целей - загрузка ее только для этого, очевидно, является излишней. Также стоит отметить, что $.getScript() и $.ajax() оба используют eval() для выполнения скрипта. eval() не является «злом» в этом контексте, так как это надежный источник, но по моему опыту иногда может быть немного сложнее отлаживать eval () - ed код.

• Опция # 4

  не представляется возможной на самом деле.

• Вариант № 5

  , рекомендованный Ником Крейвером в первом OP-комментарии, - это то, что я бы сделал с tbh - если сценарии статичны, как вы говорите, кэширование будет более эффективным, чем множественные HTTP-запросы. Вы также можете изучить использование cache.manifest для агрессивного кэширования, если вас особенно беспокоит пропускная способность: http://www.html5rocks.com/tutorials/appcache/beginner/

Answer 3

Перейти с getScript.По сути, он делает то же самое, что и второй метод, но вам не нужно беспокоиться о том, как прослушивать загрузку в различных браузерах (в основном IE).

Ответ AJAX - это просто текст, насколько DOMобеспокоен.Это не имеет никакого эффекта, если вы как-то не вставите это в DOM.