Совместимость Internet Explorer
1. Резюме
В этой статье описываются характеристики интернет -проводника (т.е.), обрабатывающего пользовательские атрибуты HTML и теги HTML (которые можно понимать как «специально плохие свойства»). Если мы планируем сделать приложение совместимым с IE8 и ниже, мы можем продолжать читать.
2. Короткая версия (краткое описание)
Чтобы наше угловое приложение поработало над IE, убедитесь:
1. Представьте json.stringify по мере необходимости (IE7 или ниже требует этой вещи). Мы можем использовать json2 (https://github.com/douglascrockford/json-js) или json3 (http://bestiejs.github.com/json3/).
2. Не используйте пользовательские теги, такие как <ng: view> (замените версиями атрибутов, такими как <div ng-view>). Если вы все еще хотите его использовать, см. Точку 3.
3. Если вы действительно хотите использовать пользовательские теги, вы должны сделать следующие шаги, чтобы дать старым IE знать ваши пользовательские теги.
<html xmlns: ng = "http://angularjs.org"> <Head> <!-[если lte ie 8]> <script> document.createElement ('ng-inplude'); document.createElement ('ng-pluralize'); document.createElement ('ng-view'); // необязательно это для css document.createElement ('ng: include'); document.createElement ('ng: плюрализуется'); document.createElement ('ng: view'); </script> <! [endif]-> </head> <body> ... </body> </html>Что нужно внимания:
XMLS: NG - пространство имен - Для каждого пользовательского тега, которую мы планируем использовать, необходимо быть пространством имен.
document.createElement («Имя пользовательского тега»)-Создание пользовательского имени тега-потому что это проблема со старой версией IE, нам нужно справиться с ним специально через комментарии о суждениях (<!-[если IE 8]>>… <! [Endif]->). Для каждого тега без пространства имен или не-HTML по умолчанию этот вид предопределенного требуется, чтобы IE не был бы глупым (например, нет стиля ...).
3. Длинная версия (детали)
IE имеют проблемы с обработкой нестандартных тегов HTML. Это может примерно иметь два типа атмосферы (с пространством имен и без имен), и каждая категория имеет свое собственное решение.
Если имя тега начинается с «my:», оно будет рассматриваться как пространство имен, и должно быть определено соответствующее определение пространства имен (<html xmlns: my = "игнорируется">).
Если у тега нет пространства имен (начиная с XX :), но не является стандартным HTML, его необходимо объявить через Document.createElement («Имя тега»).
Если мы планируем определить стили для пользовательских тегов, мы должны использовать Document.createElement («Имя тега») для настройки его, независимо от пространства имен XML (экспериментально доказывает, что значение относительного пространства имен XML очень вероятно: не нужно заботиться о пользовательских тегах с пространством имен).
4. Хорошие новости
Хорошей новостью является то, что это ограничение предназначено только для имен элементов и не влияет на имена атрибутов. Следовательно, нет необходимости делать специальную обработку для пользовательских свойств (<div> my-tag your: Tag> </div>).
5. Что произойдет, если я не могу этого сделать? (Что произойдет, если вы не будете выполнять эти методы лечения?!)
Предположим, что у нас есть нестандартный HTML-тег (тот же результат для My: Tag или My-Tag. Но после тестирования мы обнаружили, что метод пространства имен не будет иметь такого раздражения).
<html> <body> <mytag> немного текста </mytag> </body> </html>
Вообще говоря, он будет преобразован в следующую структуру DOM:
#document +- html +- body +- mytag +- #text: немного текста
Мы ожидаем, что у элемента тела есть детский элемент MyTag, а у MyTag есть текстовый дочерний элемент «немного текста».
Но т.е. не делает этого (если будут приняты корректирующие меры, это не будет включено)!
#document +- html +- body +- mytag +- #text: немного текста +- /mytag
IE, тело будет иметь 3 детских элемента:
1. Самостоятельный «mytag», похожий на <br/>. «/» В конце не является обязательным, но тег <br> не допускает никаких детских элементов, поэтому браузер делит его на три элемента братьев и сестра, а не отдельные элементы <br>, содержащие некоторые текстовые элементы.
2. Текстовый узел «немного текста». Это должно было быть ребенком элемента MyTAG, а не его родного узла.
3. Неверный самозакрывающий тег "/mytag" говорит, что это неправильно, потому что имя элемента не позволяет символу «/» (его следует разрешить в конце <br/>). Кроме того, замкнутый элемент не должен быть частью DOM (он не должен появляться в форме элемента), поскольку он используется только в качестве границы для наметки структуры DOM.
6. CSS стиль пользовательских имен тегов (определение стиля CSS для пользовательских тегов)
Если вы хотите, чтобы селектор CSS был действительным для пользовательских элементов, то пользовательские элементы должны быть предопределены с помощью Document.createElement («имя элемента»), независимо от пространства имен XML (экспериментально доказывает, что здесь нет необходимости беспокоиться о пространстве имен XML?!)
Вот пример определения стиля пользовательского тега:
<! Doctype html> <html xmlns: ng = "необходимо для ng: nempace"> <head> <Title> IE Compatibility </title> <!-[если lte ie 8]> <script> // необходимо сделать ng-include prise document.createElement ('ng-include'); // необходимо включить справочный документ css.createElement ('ng: view'); // Комментарий - это нормально? ! </script> <! [endif]-> <style> ng/: view {display: block; Граница: 1px твердый красный; Ширина: 100px; высота: 100px; } ng-include {display: block; Граница: 1px твердый синий; Ширина: 100px; высота: 100px; } </style> </head> <body> <ng: view> </ng: view> <ng-include> </ng-include> </body> </html>