Использование JQuery для загрузки фрагментов страницы (использование фрагмента CSS/скриптов)

Question

Я видел много похожих вопросов, но не тот, который конкретно относится к этому вопросу.

Для веб-приложения я разработал множество специфических динамических «фрагментов» как (например, статус входа в текущий сеанс). Эти фрагменты сохраняются как неполные html (неспецифические jsp-страницы должны быть конкретными). У них нет тегов html или body. Но у css есть файлы javascript, необходимые для работы фрагмента.

Fragment.jsp

<script type="text/javascript"> 
[...]code and functions to use ajax request to load current name using sessions 
</script> 

<div id="userProfile"> 
<H1>Current User:<span id="name">NONE GIVEN</span></H1> 
</div> 

Цель затем будет использовать JQuery для загрузки фрагмент на текущей странице, добавив CSS, чтобы держать его в фиксированном положении в правом верхнем углу.

1. Что касается CSS при динамической загрузке таких фрагментов. Если такой фрагмент загружен с использованием $ ("# someID"). Load(), включенные ссылки CSS и JS загружаются в текущий контейнер, что делает html недействительным?

2. Загрузка только фрагмента с использованием выделения в URL-адресе $ ("# someID"). Load ("/ fragments/Fragment.jsp #userProfile") ;, а затем динамическая загрузка css и js.

Я думаю, что добавление кода статически страницам следует избегать, так как количество страниц, которые используют фрагмент приведет к необходимости внесения изменений в несколько страниц, что приводит к unmanagable сайта.

Answer 1

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

-Я использую Tomcat с сервлетами/JSP в качестве серверной части, но это не влияет на создание и использование виджетов.

fragment.jsp

<div id="widget"> 
This contains the widget html. For the example here is a div to fill with data dynamically 
<div id="dynamic"></div> 
</div> 

fragment.js

function initiateFragment(){ 
    $.get(aUrl,function(data){ 
    //callback goes here 
    $("body").append(data); 
    $("#dynamic").html(//dynamic content for the div); 
    $("#widget").css(//Add any css here, don't include it to force modularity); 
    //Since I needed a login widget, I added css to move the div out of document flow and to the top right 
    }); 
} 

Теперь, просто позвонив по телефону initiateFragment() на моей главной странице (убедитесь, что fragment.js включен), фрагмент нагрузки и появляется.