HTML-тег <iframe>

Характеристики

• Тип: встроенный контент, интерактивный
• Назначение: Вставляет встраиваемый фрейм, который может содержать другой документ.
• Родители: Любые элементы, допускающие встроенный контент.
• Потомки: Альтернативный текст для браузеров, не поддерживающих <iframe>.
• Глобальные атрибуты: все
• Атрибуты событий: все

Атрибуты

• src — URL документа, который будет отображаться внутри iframe.
• name — Имя iframe, используемое при работе с целевыми ссылками.
• width — Ширина iframe.
• height — Высота iframe.
• sandbox — Набор ограничений для контента внутри iframe.
• allow — Указывает, какие функции разрешены для содержимого iframe.
• referrerpolicy — Управляет политикой реферера для запросов внутри iframe.
• srcdoc — Внутренний HTML-код для отображения внутри iframe.
• loading — Указывает, как загружать iframe (lazy, eager).

Пример использования

<iframe src="https://www.example.com" width="600" height="400" title="Пример"></iframe>

Использование в JavaScript

// Изменение источника iframe
const iframeElement = document.querySelector('iframe');
iframeElement.src = 'https://www.newdomain.com';

Рекомендации по обеспечению доступности (a11y)

• Всегда указывайте атрибут title для описания содержимого фрейма.
• Избегайте чрезмерного использования фреймов, так как это может затруднить навигацию.
• Убедитесь, что содержимое внутри фрейма доступно.

Полезные ссылки

• Статья на Doka.guide о <iframe>