Заключительная шпаргалка, которая поможет понять, что же такое DHTML (Dynamic HTML) и куда двигаться дальше.

DHTML.

Основная задача DHTML – изменять содержимое динамически, то есть в результате каких-то событий (например действий пользователя) контент должен меняться. Внешний вид страницы задается с помощью CSS - средства для задания цветов, размеров текста или границ, оформления, теней и прочих визуальных эффектов. Приведу пример:

<div id="example" onClick="colorize()">Click on this text to change the background color</div>
<script type='text/javascript'>
    function colorize() {
        var element = document.getElementById("example");
        element.style.backgroundColor='#800';
    }
</script>

Если открыть эту страницу в браузере, то на экране появится строка “ Click on this text to change the background color” обычного черного цвета на белом фоне. При клике на нее вызовется функция “colorize()”. Внутри этой функции, используя ID упомянутой выше строки, меняется цвет фона под текстом.

Теперь немного более сложный пример, который в целом делает похожие действия:<div id="example" onClick="colorize()">Click on this text to change the background color</div>

<script type='text/javascript'>
    function colorize() {
        var element = document.getElementById("example");
        element.style.backgroundColor='#800';
        element.style.color='white';
        element.style.textAlign='center';
    }
</script>

При выполнении этой функции поменяется не только цвет фона, но и цвет самого текста, а также его расположение на экране. Текст переместится в центр страницы.

Итог.

Используя JavaScript можно наполнять страницы жизнью, красками и различными эффектами. Главное, чтобы их общее количество было умеренным и помогало восприятию материала, а не наоборот, мешало, как часто бывает на плохо сконструированных сайтах. Кроме внешнего вида DHTML используется для подгрузки данных с сервера. Например, подобный функционал можно потестировать на поисковом сайте Google.com. В процесса ввода строки поиска снизу будут выдаваться найденные страницы, удовлетворяющие запросу. Получается, что содержимое страницы динамически меняется. Вот он и есть - Dynamic HTML.