documentMode — режим сумісності в Internet Explorer

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

Document.documentMode - це властивість, яка повертає цілочисельне значення, що вказує на режим сумісності Internet Explorer, в якому працює поточний документ. Ця властивість корисна для виявлення режиму сумісності, який використовується браузером, і може допомогти у вирішенні проблем сумісності між різними версіями Internet Explorer або емуляції режиму сумісності в інших браузерах.

У більшості випадків немає потреби явно перевіряти значення document.documentMode, оскільки сучасні браузери, такі як Chrome, Firefox та Microsoft Edge, не підтримують цю властивість. Однак, якщо ваш веб-додаток повинен працювати в старих версіях Internet Explorer, ця властивість може бути корисною.

Значення document.documentMode відповідає версії Internet Explorer, в якій працює поточний документ. Наприклад, якщо document.documentMode дорівнює 9, це означає, що документ працює в режимі сумісності з Internet Explorer 9. Якщо document.documentMode дорівнює 0, це означає, що поточний документ працює в режимі сумісності з Internet Explorer 5, який є режимом сумісності за замовчуванням.

Ось приклад, як можна використовувати document.documentMode для визначення режиму сумісності Internet Explorer:

let ieVersion;

if (document.documentMode) {
  ieVersion = document.documentMode;
} else {
  // Для інших браузерів, крім Internet Explorer
  ieVersion = Infinity;
}

console.log(`Режим сумісності Internet Explorer: ${ieVersion}`);

У цьому прикладі ми спочатку перевіряємо, чи існує властивість document.documentMode. Якщо так, ми присвоюємо її значення змінній ieVersion. Якщо ні, ми присвоюємо Infinity, що вказує на те, що поточний браузер не є Internet Explorer.

Потім ми виводимо значення ieVersion у консоль. Якщо це число, воно відповідає версії Internet Explorer, в якій працює документ. Якщо це Infinity, це означає, що поточний браузер не є Internet Explorer.

Ще один приклад використання document.documentMode - це визначення, чи потрібно застосовувати певні стилі або виконувати певний код залежно від режиму сумісності Internet Explorer:

if (document.documentMode && document.documentMode < 9) {
  // Застосувати стилі або виконати код для старих версій Internet Explorer
} else {
  // Застосувати стилі або виконати код для сучасних браузерів
}

У цьому прикладі ми перевіряємо, чи існує document.documentMode і чи менше воно за 9 (що відповідає Internet Explorer 8 або старішим версіям). Якщо це так, ми застосовуємо певні стилі або виконуємо певний код, який необхідний для старих версій Internet Explorer. Інакше ми застосовуємо стилі або виконуємо код для сучасних браузерів.

правити

Порада

Уникайте встановлення document.characterSet, якщо це не абсолютно необхідно. Зміна кодування символів документа може призвести до перекодування всього вмісту, що може негативно вплинути на продуктивність та спричинити непередбачувані наслідки. Замість цього, спробуйте налаштувати кодування на рівні окремих ресурсів або використовуй відповідні методи декодування.

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

Порада

Варто зазначити, що властивість document.documentMode вважається застарілою та може бути видалена у майбутніх версіях браузерів. Тому не рекомендується покладатися на неї у нових проєктах.

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

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

Синтаксис

Document.documentMode

Переглядачі

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

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

Переглядач
	1	1	3	12.1	12

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

Переглядач
	1	18	4	1

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

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

Приклади

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

let ieMode = document.documentMode || 'Не Internet Explorer';
console.log(`Режим сумісності Internet Explorer: ${ieMode}`);

function applyStyles() {
  const styles = document.createElement('style');

  if (document.documentMode && document.documentMode < 9) {
    // Застосувати стилі для старих версій Internet Explorer
    styles.innerHTML = `
      .old-ie-styles {
        /* Стилі для Internet Explorer 8 та старіших версій */
      }
    `;
  } else {
    // Застосувати стилі для сучасних браузерів
    styles.innerHTML = `
      .modern-styles {
        /* Стилі для сучасних браузерів */
      }
    `;
  }

  document.head.appendChild(styles);
}

// Приклад використання
applyStyles();