Всем привет! Сегодня мы рассмотрим интересные возможности которые предоставляет нам тег object появившийся в спецификации html4. Итак, поехали!

Тег object служит для подключения элементов которые в изначальном состоянии могут быть не понятны браузеру.

К примеру, это видео с другого источника.

<object width="800px" height="500px" data="https://www.youtube.com/embed/3Fe8wUpWAAo"></object>

Здесь я через тег object подключил к странице видео с youtube. Как вы знаете, раньше для такого подключения приходилось пользоваться тегом iframe. Плохо это или хорошо, но теперь вместо iframe вы можете пользоваться данным тегом.

Заметьте что путь в object прописывается с помощью атрибута data.

Помимо видео через данный тег можно подключать аудио файлы и картинки.

<object width="800px" height="500px" data="78_Cowbell_SP_03.wav"></object>

<object width="800px" height="500px" data="img/mask.png"></object>

В данном примере мы со своего источника подключили аудио файл 78_Cowbell_SP_03.wav и картинку mask.png. Ничто не мешает нам указывать пути и к сторонним источникам.

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

<object width="800px" height="500px" data="test.html"></object>

<object width="800px" height="500px" data="https://webfanat.com"></object>

Здесь мы подключили файл test.html и подгрузили страницу https://webfanat.com. По своей сути элемент object это новая альтернатива элементу iframe. Он также возвращает заголовки с другого источника элемент которого мы подключаем. Разница заключается в том что iframe встраивает элементы на страницу, а object их подключает и делает понятными для браузера.

Данный элемент поддерживается всеми современными браузерами за исключением пожалуй что IE.

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

На этом у меня все. Желаю успехов и удачи! Пока.