Ищете хороший способ отделить Javascript и HTML - PullRequest
0 голосов
/ 16 февраля 2012

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

Сначала я думаю, что вывод html с сервера должен быть в основном для тех, у кого нет js или если есть ошибка браузера. Таким образом, страница будет работать для всех, я надеюсь.

Тогда я думаю, что jquery должен иметь скрытые данные и шаблоны, которые он использует для изменения страницы.

Я не знаю, в каком формате должны быть шаблоны. Одна из идей - просто сделать так:

<div id="checkbox-template" class="templatedefinition" style="visibility:hidden">
<input type="checkbox"><label></label>
</div>

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

$(document.createElement())

И тогда есть несколько вариантов обработки данных. Я пробовал что-то простое, как это:

var fruits= new Array(
    // id - Label - info
    new Array("orange","Orange","some info"),
    new Array("apple","Apple","some info"),
    new Array("banana","Banana","some info")
    );

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

1 Ответ

1 голос
/ 18 февраля 2012

Прежде всего позвольте мне сказать, что в вашем вопросе нет жесткого и быстрого правила, и, тем не менее, он выражает личное предпочтение конкретным ситуациям.Вот некоторые соображения, которые помогут вам в этом:

Сначала я думаю, что вывод html с сервера должен быть в основном для тех, у кого нет js или если есть ошибка браузера.Таким образом, страница будет работать для всех, я надеюсь.

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

Вы также спрашиваете, должны ли вы выводить скрытые HTML-элементы, которые предназначены только для «расширенного опыта Javascript» в HTML, или вы должны «сгенерировать» его на лету, используя Javascript.Это подводит нас к другому термину - « Ненавязчивый JavaScript ».

Одна из идей заключается в том, чтобы никогда не размещать на своей HTML-странице ничего, предназначенного только для JavaScript, и использовать Javascriptсам добавить эти вещи в DOM .Преимущество этого состоит в том, что у вас будет более чистая, более легкая и портативная html-страница.

Другая школа мысли - быть менее «пуристическим» и более «практичным», то есть делать то, что наиболее эффективно.Не пишите лишние 100 строк кода Javascript и потратьте дополнительные 2 часа, если вы можете просто добавить дополнительный код непосредственно на страницу HTML и скрыть его с помощью css.

Я лично считаю, что как программисты мы должнывсегда принимайте во внимание бизнес-ценность при принятии этих решений.Спросите себя: «Сколько времени я должен потратить на это?», «Создаю ли я сайт для 5 500 или 5 миллионов пользователей?».В основном, не используйте гранату, чтобы убить мышей;)

...