Описание
По дизайну большинство кода jquery приводит к большому количеству жесткой связи, например. селектора принимают определенную структуру html
var mySubnav = $("#navigation a.sub-menu");
Если соответствующий html изменяет, по каким-либо причинам,
<a class="subMenu" .... </a>
Функциональность нарушена.
Вопрос
- Какой лучший способ справиться с жесткой связью?
- Какие существуют подходы к его ослаблению?
Ответы, подходы
- используйте атрибут пользовательских данных html для разделения css из js-логики. например добавьте
data-submenu="true"
в html и используйтеvar mySubnav = $("[data-submenu]");
со стороны js. - реализовать простую среду тестирования
- как можно более свободным, используя наименее специфичные селекторы, например.
$("a.sub-menu')
. См. также - Устранить фактические строковые литералы, которые представляют селектор CSS из тела вашего кода jQuery, (1) заранее заблаговременно извлекают ссылки на статические элементы DOM и (2) сохраняют селекторные строки в одном месте (вверху вашего кода).
- используйте фреймворки javascript, например Backbone, которые отделяют javascript от DOM с помощью представлений
- используйте delegate и live относительно связи из-за управления событиями.