JS властивість Array.embeds

Загальний опис

Властивість embeds в об'єкті Document відкриває доступ до колекції усіх елементів <embed> у поточному документі. Ці елементи використовуються для вбудовування зовнішнього контенту, такого як відео, аудіо, інтерактивні мапи та інші мультимедійні об'єкти безпосередньо у HTML-документ. Властивість embeds, яка є синонімом до document.getElementsByTagName('embed'), надає простий спосіб для доступу та маніпуляції з цими елементами, що робить її незамінною для веб-розробників, які прагнуть динамічно керувати вбудованим контентом на своїх веб-сторінках.

Використання властивості embeds дозволяє розробникам легко отримувати доступ до всіх елементів <embed> на сторінці. Це може бути корисно для динамічної зміни властивостей цих елементів, наприклад, зміни джерела (src) вбудованого контенту або його атрибутів (наприклад, розміру) засобами JavaScript.

Приклади використання

Отримання кількості вбудованих елементів:

Для початку, ви можете просто підрахувати кількість вбудованих елементів на сторінці:

console.log(document.embeds.length);

Цей код виводить в консоль кількість елементів <embed>, знайдених у поточному документі.

Зміна властивостей вбудованих елементів:

Розглянемо, як змінити джерело для всіх вбудованих елементів:

for (let i = 0; i < document.embeds.length; i++) {
    document.embeds[i].src = 'https://example.com/new-content.swf';
}

У цьому прикладі для кожного вбудованого елемента змінюється атрибут src, що дозволяє замінити весь вбудований контент на новий.

Взаємодія з конкретним вбудованим елементом:

Якщо потрібно працювати лише з одним конкретним елементом, можна використовувати ідентифікатор або інший селектор для доступу до нього:

let myEmbed = document.getElementById('myEmbedId');
myEmbed.width = '640'; // Зміна ширини
myEmbed.height = '480'; // Зміна висоти

Такий підхід дає можливість точно керувати кожним елементом <embed>, налаштовуючи його властивості відповідно до потреб розробки.

правити

Порада

Переглядайте колекцію document.embeds для аналізу наявних <embed> елементів, що може допомогти у виявленні та усуненні проблем з відображенням або доступністю вбудованого контенту. Наприклад, це може бути корисно при аудиті веб-доступності, забезпечуючи альтернативний контент для користувачів із обмеженими можливостями.

автор: Bond правити

Порада

Використовуйте document.embeds для визначення кількості <embed> елементів на сторінці, що може слугувати індикатором загальної кількості вбудованого контенту. Це допоможе у вимірюванні впливу вбудованих елементів на час завантаження сторінки та загальну продуктивність, дозволяючи оптимізувати веб-ресурси для кращого користувацького досвіду.

автор: Bond правити

Порада

Для масової зміни атрибутів усіх <embed> елементів скористайтеся ітерацією по колекції document.embeds, що дозволяє автоматизувати процеси настройки, наприклад, при зміні шляхів доступу до медіа-ресурсів або їх параметрів. Це значно спрощує управління вбудованим контентом на великих веб-сайтах.

Array.from(document.embeds).forEach(embed => {
    embed.src = 'новий_шлях_до_ресурсу';
});

автор: Bond правити

+ додати пораду чи нотатку

Синтаксис

Document.embeds

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі Серверні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
	64	1	10.1	51	12

Підтримка: мобільні переглядачі

Переглядач
	64	64	4	10.3

Підтримка: серверні переглядачі

Переглядач
	-	-

Приклади

+ запропонувати свій приклад у пісочниці

// Підрахунок та виведення кількості елементів <embed> на сторінці
console.log('Кількість елементів <embed> на сторінці: ' + document.embeds.length);

// Динамічна зміна джерела для першого елемента <embed> на сторінці
if (document.embeds.length > 0) {
  const firstEmbed = document.embeds[0]; // Отримання першого елемента <embed>
  firstEmbed.src = 'https://example.com/new-content.svg'; // Зміна джерела контенту
  console.log('Джерело першого елемента <embed> змінено на: ' + firstEmbed.src);
}