Другое применение элемента object
Хотя элемент object, в основном, используется для встраивания контента для плагинов, он был изначально задуман как более общая альтернатива нескольким элементам, в том числе img. В следующих разделах я опишу другие способы использования элемента object. Хотя эти функции были представлены в спецификации HTML уже давно, не все браузеры их поддерживают. Я включил эти разделы для полноты картины, но я рекомендую вам использовать более конкретные и точные элементы, такие как s.
Совет
Атрибут
formпозволяет связать элементobjectс HTML-формами (о которых шла речь в главе 12). Это нововведение в HTML5. В настоящее время ни один из браузеров не поддерживает этот атрибут, а спецификация HTML5 довольно расплывчато описывает работу этой функции.
Использование элемента object для вставки рисунков
Как я уже упоминал, одним из элементов, который должен был заменить object, является img. Как следствие, теперь вы можете использовать элемент object, чтобы вставлять изображения в HTML документы. В листинге 15-9 представлен пример.
Листинг 15-9: Вставка изображения при помощи элемента object<!DOCTYPE HTML>
<html>
<head>
<title>Example</title>
<meta name="author" content="Adam Freeman" />
<meta name="description" content="A simple example" />
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
</head>
<body>
<object data="triathlon.png" type="image/png">
</object>
</body>
</html>В этом примере я применил атрибут data для ссылки на изображение, которое я использовал ранее в этой главе. Браузер встраивает и отображает изображение так же, как это происходит, когда вы используете элемент img, как показано на рисунке 15-8.
Рисунок 15-8: Вставка изображения при помощи элемента object
Использование элемента object для создания клиентской карты-изображения
Вы также можете применять элемент object для создания клиентских карт-изображений. Атрибут usemap может использоваться для связывания элемента map с элементом object, как показано в листинге 15-10. Я использовал те же элементы map и area таким же образом, как я делал, когда выполнял эту же задачу при помощи элемента img.
Листинг 15-10: Создание клиентской карты-изображения при помощи элемента object<!DOCTYPE HTML>
<html>
<head>
<title>Example</title>
<meta name="author" content="Adam Freeman" />
<meta name="description" content="A simple example" />
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
</head>
<body>
<map name="mymap">
<area href="swimpage.html" shape="rect" coords="3,5,68,62" alt="Swimming" />
<area href="cyclepage.html" shape="rect" coords="70,5,130,62" alt="Running" />
<area href="otherpage.html" shape="default" alt="default" />
</map>
<object data="triathlon.png" type="image/png" usemap="#mymap">
</object>
</body>
</html>
Внимание
Не все браузеры поддерживают карты-изображения, созданные при помощи элемента
object. На момент написания этой книги Google Chrome и Apple Safari не поддерживали эту функцию.
Использование элемента object в качестве браузерного контента
Вы можете использовать элемент object, чтобы вставить один HTML документ внутрь другого, как мы это делали при помощи элемента iframe. Если применить атрибут name, мы создадим браузерный контекст, который можно использовать с атрибутом target таких элементов, как form. В листинге 15-11 показано, как это можно сделать.
Листинг 15-11: Создание браузерного контекста при помощи элемента object<!DOCTYPE HTML>
<html>
<head>
<title>Example</title>
<meta name="author" content="Adam Freeman"/>
<meta name="description" content="A simple example"/>
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
</head>
<body>
<header>
<h1>Things I like</h1>
<nav>
<ul>
<li>
<a href="fruits.html" target="frame">Fruits I Like</a>
</li>
<li>
<a href="activities.html" target="frame">Activities I Like</a>
</li>
</ul>
</nav>
</header>
<object type="text/html" name="frame" width="300" height="100">
</object>
</body
</html>Эта функция работает только в том случае, если вы установите атрибут type на text/html, но даже и тогда браузерная поддержка для нее не является универсальной. На момент написания этой книги Google Chrome и Apple Safari являлись единственными основными браузерами, которые поддерживали эту функцию.
