Используйте CSS / Javascript, полученный через AJAX

Question

Я экспериментирую с элементом управления вкладками jQuery UI, и у меня есть три вкладки, каждая из которых загружает свою страницу через AJAX.Загруженные страницы являются полными html-страницами с их собственным Javascript и CSS.

Скрипты, которые встроены в тело html, в порядке, так же как CSS в атрибуте style для тегов, но Javascript и CSSв заголовке загруженные страницы вообще не используются.

Как я могу использовать Javascript и CSS в заголовке загруженных страниц?Или я должен включить все CSS и Javascript на странице, содержащей элемент управления вкладкой?

Answer 1

Загрузка AJAX отфильтрует все, что не находится в элементе body. Вы можете поместить теги CSS / Javascript в тело, и они будут добавлены на вашу страницу, но я бы избегал этого, если это вообще возможно. Если вы не будете осторожны, вы в конечном итоге включите вещи несколько раз.

Я предлагаю разместить на странице, содержащей вкладки, такие общие элементы, как сам jQuery, плагины и т. Д., И размещать сценарии, специфичные для вкладок, только в тех битах, которые загружаются через AJAX. Вы должны быть осторожны при управлении идентификаторами - они должны быть глобально уникальными, а не уникальными на вкладке. Придерживаться классов - это лучший способ справиться с этим или предварять ваши идентификаторы именем вкладки. Для CSS я постараюсь сделать так, чтобы CSS применялся ко всей странице, включая вкладки, и загружал ее вместе со страницей.

YMMV.

Answer 2

Вы можете добавить эту строку в своей голове:

<link rel="stylesheet" id="yourid" type="text/css" />

и это после вашего вызова ajax:

document.getElementById('yourid').href='css/'+yourvariable+'.css';}

И вы можете сделать то же самое для скриптов (измените rel и введите).