Иллюстрированный самоучитель по созданию сайтов


Динамическое отображение текста веб-страницы - часть 2


<HR> </DIV> Теперь вместо ссылки на второй рассказ напишем просто

<SPAN onClick="show_hammer()">Рассказ &laquo;МОЛОTOK&raquo;</SPAN>

Как видите, теперь, если пользователь щелкнет мышью на словах Рассказ “Молоток”, то будет выполнена функция show_hammer(). По нашей задумке, она должна заменить текст сказки на текст рассказа “Молоток”.

Вспомним, что весь текст сказки был заключен в блок

<DIV>

. А у любого блока

<DIV>

, как и у большинства других элементов, имеется свойство innerHTML, значение которое содержит весь HTML-код данного элемента! Это означает, что если мы изменим значение этого свойства, изменится и HTML-V.OJS,, а значит, и текст, содержащийся на странице. Наша функция show_hammer() может выглядеть, например, вот так:

function show_hammer() { document .all. rasskaz . innerHTML=' <H2>MOЛOTOK<BR>

<SPAN STYLE="font-style: italic ;">paccкaз</SPAN></H2>

<DIV STYLE="text-align: right;">

<DIV CLASS="epig">Mы кузнецы, и дух наш молод.<DIV CLASS="pdps">(Из песни) </DIV></DIV></DIV><BR>

<DIV CLASS="аЬ">Это случилось очень давно, уж и не помню в каком году, в каком веке и в каком тысячелетии. . . (Здесь располагается текст рассказа) </DIV>;

}

Как видите, эта функция выполняет всего одно действие — присваивает свойству document.all. rasskaz. innerHTML значение, содержащее длинную-предлинную строку. В этой строке содержится весь HTML-код, рассказа “Молоток”




- Начало -  - Назад -  - Вперед -