Вам нужно Ненавязчивый Javascript , который является частью Прогрессивное улучшение .
Во-первых, начните создавать полнофункциональное веб-приложение без любой строки Javascript. Как только вы заставите его работать, начните писать код Javascript, который «берет на себя» необработанную работу HTML без изменения любой строки HTML / CSS. В коде на стороне сервера вам нужно добавить логику , которая распознает, был ли выполнен запрос JavaScript или нет, и возвращает ответ соответственно. Вы можете проверить оба случая, включив / отключив JavaScript в веб-браузере. В Firefox это просто с Панель инструментов веб-разработчика .
Например, у вас есть список писем со всеми ссылками HTML, которые должны показывать тело письма:
<a href="mail/show/1" class="show">Message title</a>
Без JavaScript это вызовет HTTP-запрос к сервлету, который загружает почту, обозначенную 1, перенаправляет запрос в JSP, который скрывает список сообщений в представлении и показывает почту в представлении.
В JavaScript / jQuery вам нужно написать код, который делает то же самое с помощью Ajax, например ::
$('a.show').click(function() {
$.getJSON(this.href, callbackFunctionWhichHidesListAndShowsMail);
return false;
});
На стороне сервера вы должны различать обычные запросы и запросы ajax, чтобы вы могли соответствующим образом возвращать ответ.
boolean ajax = "XMLHttpRequest".equals(request.getHeader("x-requested-with"));
// ...
if (ajax) {
writeJson(response, mail);
} else {
request.setAttribute("mail", mail);
request.getRequestDispatcher("/WEB-INF/mail.jsp").forward(request, response);
}
Наконец, чтобы дать пользователю возможность переключаться между режимами вручную, вы должны установить куки или предпочтительно (так как куки отключены) передать некоторую информацию в URL (pathinfo или параметр запроса), который заставляет сервер отключить передачу <script> строк.