Поделиться через


Обзор служебных программПанель инструментов разработчика в Internet Explorer

Лэнс Уитни (Lance Whitney)

Разрабатываете ли вы веб-содержимое самостоятельно, или просто оказываете поддержку своему локальному веб-мастеру, у вас есть возможность воспользоваться бесплатной служебной программой Майкрософт, которая облегчит работу. Панель инструментов разработчика в Internet Explorer облегчает исправление ошибок поведения веб-страниц, поскольку позволяет взглянуть на них с «обратной стороны». Панель инструментов отображает все теги и стили для текста, таблиц, изображений и другого содержимого HTML. Можно просмотреть правила стилей, выделить конкретные элементы на своей странице и даже проверить HTML и CSS.

Панель инструментов разработчика в Internet Explorer устанавливается из загружаемого файла IEDevToolBarSetup.msi. После установки следует повторно открыть Internet Explorer, и в командной строке отобразится новая кнопка с именем IE Developer Toolbar (панель инструментов разработчика в IE). Щелкните кнопкой мыши, и в нижней части окна обозревателя откроется панель инструментов, разделенная на области (см. снимок экрана). В первой области отображается дерево, содержащее все элементы веб-страницы. Щелкнув любой элемент, можно просмотреть его атрибуты и стили в двух других областях.

С помощью выпадающих меню можно выделить конкретные элементы на экране, либо щелкнув их, либо выполняя их поиск. Поиск всех тегов h3, например, приводит к их последовательному отображению в дереве. При последующем поиске тега на странице выделяется соответствующий ему элемент. Поиск можно выполнять также выбирая конкретные категории, например теги div, таблицы, изображения и объекты, размещенные с помощью абсолютного или относительного позиционирования.

\\msdnmagtst\MTPS\TechNet\issues\en\2008\11\Whitney - Utility\layout\FIGURES\fig01_L.gif

Веб-страница «с обратной стороны»

Панель инструментов особенно удобна для работы с правилами стилей. Она позволяет выделить на странице все элементы, отформатированные с использованием ID или стилей классов. Для определения места и способа применения стилей предусмотрено генерирование отчета о всех правилах из таблицы стилей. Есть даже возможность отключения всех CSS, что позволяет увидеть, какое влияние оказывают стили на элементы страницы.

Для управления графическими объектами с помощью панели инструментов предусмотрено активирование и отключение изображений и получение для каждого изображения информации о разрешении, формате, пути и теге alt. Кроме этого, панель инструментов генерирует удобный для чтения отчет об изображении, в котором приведены основные сведения обо всех графических элементах.

Использование панели инструментов позволяет без труда изменять размер страницы обозревателя до любого разрешения — от 800x600 до 1280x1024 или задавать собственный пользовательский формат. Экранная линейка измеряет любой элемент в пикселах. Отображаются инструмент палитры цветов и пипетка, которые позволяют выбрать объект для просмотра его значения цвета в формате RGB и в шестнадцатиричном формате.

Для облегчения поиска и устранения неполадок на веб-странице в панели инструментов предусмотрено отключение некоторых элементов, например JavaScript и «cookies». Исходный HTML содержимого можно просмотреть как для всей страницы, так и только для выбранного объекта. Более того, отображаемый исходный код отформатирован и размечен цветом для облегчения отделения содержимого от тегов. В дереве предусмотрено даже добавление и удаление стилей и других атрибутов на визуализированном отображении страницы, чтобы было видно оказываемое ими влияние. Наконец, панель инструментов обеспечивает проверку содержимого на правильность XHTML, наличие нарушенных ссылок и доступность, отправляя страницу службе проверки World Wide Web Consortium (W3C).

Панель инструментов разработчика в Internet Explorer совместима с Internet Explorer 6 и 7 в операционных системах Windows XP, Windows Vista и Windows Server 2003. За подробными сведениями и ссылкой для загрузки панели инструментов обратитесь на веб-страницу по адресу go.microsoft.com/fwlink/?LinkId=125120.

Лэнс Уитни (Lance Whitney) — консультант по информационным технологиям, веб-разработчик и разработчик технической документации. Он провел бессчетные часы за настройкой рабочих станций и серверов Windows. Журналист по профессии, 15 лет назад он занялся изучением информационных технологий.