Редактирование кода в представлении «Дизайн»

Dreamweaver поддерживает визуальное создание и редактирование веб-страниц без необходимости писать базовый исходный код вручную. Однако может понадобиться отредактировать код в тех случаях, когда нужен более полный контроль или требуется устранение неполадок в работе веб-страницы. Dreamweaver позволяет определенным образом редактировать код, не выходя из представления «Дизайн».

Этот раздел предназначен для тех, кто предпочитает работать в представлении «Дизайн», но хочет иметь быстрый доступ к коду.

Если в представлении «Дизайн» выбрать объект, содержащий дочерние теги, например таблицу HTML, то можно быстро выделить первый дочерний тег этого объекта путем выбора в меню «Правка» пункта «Выбрать дочерний элемент».

Например, тег <table> обычно имеет дочерние теги <tr>. Если в селекторе тегов выбрать тег <table>, то можно выделить первую строку таблицы путем выбора в меню «Правка» пункта «Выбрать дочерний элемент». Dreamweaver выбирает в селекторе тегов первый тег <tr>. Поскольку тег <tr> сам имеет дочерние теги, а именно теги <td>, при повторном выборе команды «Выбрать дочерний элемент» в меню «Правка» выделяется первая ячейка таблицы.

Редактирование кода в окне инспектора свойств

С помощью инспектора свойств можно проверять и редактировать атрибуты текста и атрибуты объектов на странице. Свойства, отображаемые в окне инспектора свойств, обычно соответствуют атрибутам тегов. Изменение свойства в инспекторе свойств, как правило, влечет за собой те же изменения, что редактирование соответствующего атрибута в представлении «Код».

Изменение CFML в окне инспектора свойств

Проверка и изменение разметки ColdFusion в представлении «Дизайн» с помощью инспектора свойств.

Обзор редактора Quick Tag

Редактор тегов Quick Tag используется в случаях, когда требуется быстро проверить, вставить или изменить теги HTML, не закрывая представление «Дизайн».

Если при работе в редакторе тегов Quick Tag пользователь вводит некорректный код на языке HTML, Dreamweaver пытается исправить код, вставляя там, где это необходимо, закрывающие кавычки или закрывающие угловые скобки.

Чтобы настроить параметры редактора тегов Quick Tag, откройте окно этого редактора. Для этого нажмите клавиши Ctrl+T (Windows) или Cmd+T (Macintosh).

Редактор Quick Tag имеет три режима.

• Режим вставки HTML используется для вставки нового кода HTML.
• Режим изменения тегов используется для изменения существующих тегов.

• Режим вставки HTML используется для вставки нового кода HTML.

• Режим изменения тегов используется для изменения существующих тегов.

• Режим заключения в тег используется для размещения тега вокруг выделенного фрагмента кода.

Во всех трех режимах порядок работы в окне редактора Quick Tag один и тот же: открыть редактор, ввести или изменить теги и атрибуты, закрыть редактор.

Когда открыто окно редактора Quick Tag, пользователь может переключаться между режимами с помощью клавиш Ctrl+T (Windows) или Cmd+T (Macintosh).  

Изменение кода с помощью редактора Quick Tag

Быстрый редактор тегов («Правка» > «Редактор Quick Tag») используется для быстрой вставки и редактирования HTML-тегов, не закрывая представление «Дизайн».

Вставка тега HTML

Изменение тегов HTML

Заключение выделенной области кода в теги HTML

Использование меню подсказок в редакторе Quick Tag

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

Кроме того, можно отключить меню подсказок или настроить время задержки, после которой это меню раскрывается в окне редактора Quick Tag.

Чтобы увидеть меню подсказок, где перечислены допустимые атрибуты для тегов, сделайте короткую паузу в процессе редактирования имени атрибута в окне редактора Quick Tag. На экране появится меню подсказок с перечнем всех допустимых атрибутов для редактируемого тега.

Аналогичным образом, чтобы отобразилось меню подсказок, где перечислены допустимые имена тегов, сделайте короткую паузу в процессе ввода имени тега в окне редактора Quick Tag.

Отключение меню подсказок или изменение времени задержки

Редактирование кода с помощью селектора тегов

С помощью селектора тегов можно выделять, изменять или удалять теги, не закрывая представление «Дизайн». Селектор тегов находится в полосе состояния в нижней части окна «Документ» и содержит ряд тегов.

Изменение или удаление тега

Выделение объекта, соответствующего тегу

Написание и редактирование сценариев в представлении «Дизайн»

С клиентскими сценариями JavaScript и VBScript можно работать в представлениях «Код» и «Дизайн» следующим образом.

• Написание сценариев для страницы на языках JavaScript или VBScript без выхода из представления «Дизайн».

• Создайте в документе ссылку на внешний файл сценария, не закрывая представление «Дизайн».

• Отредактируйте сценарий, не закрывая представление «Дизайн».

  Перед началом работы выберите меню «Просмотр» > «Вспомогательные элементы» > «Невидимые элементы». На странице отобразятся маркеры сценариев.

Написание клиентского сценария

Тег сценариев для выбранного файла вставляется в документ.

Редактирование сценария

Редактирование серверных сценариев ASP в представлении «Дизайн»

С помощью инспектора свойств сценариев ASP можно просматривать и изменять серверные сценарии ASP в представлении «Дизайн».

Редактирование сценариев на странице с помощью инспектора свойств

Использование вариантов поведения JavaScript

На вкладке «Поведение сервера» инспектора тегов можно легко присоединять (клиентские) варианты поведения JavaScript к элементам страниц. Дополнительные сведения см. в разделе Применение встроенных сценариев JavaScript в Dreamweaver.