Page 18 - jQuery для начинающих

Разделяй и властвуй

Тут стоит запомнить несколько простых правил:

— выносим JavaScript во внешние файлы
— никогда не пишем inline обработчиков событий (onclick="some()")
— выносим CSS из HTML во внешние файлы
— никогда не пишем inline стилей (style="color:red")
— и ещё разок для закрепления – не пишем inline!

Теперь приведу код, за который следует что-нибудь ломать (это пример плохого кода,
уточняю для тех, кто не понимает намёков):

<script>
function doSomething(){ /* … */ }
/* раздается хруст сломанных костей запястья, чтобы не печатал */
</script>
<style>
p { line-height:20px; }
/* крхххх… берцовая кость, и на работу уже не пойдет */

</style>
<div style="color:red;font-size:1.2em">
<p onclick="doSomething();">Lorem ipsum dolor sit amet...</p>
<!-- тыдыщь, головой об стол… насмерть. как жест милосердия -->
</div>

Неясно, почему же это плохо? Похоже, вам просто не приходилось менять дизайн для уже
готового сайта :) Проясню суть проблемы: вам ставят задачу – надо поменять цвет шрифта
для всех страниц сайта, коих может быть три десятка. Это могут быть не только HTML-файлы,
а страницы какого-то шаблонизатора, разбросанные по двум десяткам папок (и это еще не
самый плохой вариант). И тут появляется он — красный абзац. Вероятность услышать «слова
поддержки» в адрес автора сего кода будет стремиться к единице. Насчет inline-

обработчиков событий ситуация похожа, вот представьте себе — пишите вы JavaScript код,
всё отлично, всё получается, пока вы не пытаетесь кликнуть по красному абзацу, он
оказывается вам не подвластен, и живёт своей собственной жизнью, игнорируя все ваши
усилия. Вы смотрите код, и опять кто-то услышит эти слова...
Применив четыре правила «красного абзаца» у вас должен будет получиться чистый и
предсказуемый HTML код:

<div id="abzac">
<p>Lorem ipsum dolor sit amet...</p>
</div>

18

www.trk.kg