Предисловие
Поддержка атрибутов JQUERY - это модуль, который определяет, совместимы ли браузеры. Этот модуль содержит вопросы совместимости, такие как LevelwhitePace, Tbody, HtmlSerialize, Style, Hrefnormalized, непрозрачность, Cssfloat, Checkon, Optselected, GetSetAttribut код
Сегодня я рассмотрю эти вещи. Протестированные браузеры являются FF, Chrome, IE11 и IE6-IE10 моделируются с использованием IE11:
$ .support.LeadingWhitEpace - - автоматически удалять пространства в т.е.
$ .support.checkon ―-heak по умолчанию радио в Chrome является Checkon
$ .support.tbody ―-i-i автоматически генерирует tbody через innerhtml
$ .support.htmlserialize - Стандартный браузер автоматически генерирует теги ссылки
$ .support.style ―-ie67 getattriute получит различные типы данных ....
$ .support.opacity ―- IE678 не поддерживает непрозрачность
$ .support.cssfloat -поддерживается стандартным браузером CSSfloat, то есть должен использовать стиль
$ .support.optseledicted - Браузер не устанавливает опцию по умолчанию
$ .support.getSetAttribute ―-GetSetAtTribute Совместимость между браузерами
$ .support.html5clone - - Выпуск копирования тегов
$ .support.boxmodel - Модель поддержки
$ .support.submitbubbles ―-bubble
$ .support.ChangeBubbles -Bubble
$ .support.focusinbubbles ―-bubble
$ .support.deleteexpando yeme yeme yement является компонентом Com, и не может удалить атрибуты компонента.
$ .support.nocloneevent - Событие для копирования элемента
$ .support.reeliablehiddenoffsets - проблема TD в TR в элементе таблицы;
$ .support.boxsizing - поддерживается ли коробка
$ .support.dosnotincludemargininbodyoffset ―-body не содержит маржи (это проблема?)
$ .support.pixelposition - Получите, возвращается ли значение пикселя в стиле
$ .support.boxsizingEreliable
$ .support.reliablemarginright - - ошибка в марже в Chrome
$ .support.inlineblockneedslayout - - Проблема с макетом в IE
$ .support.shrinkwrapblocks - - проблема автоматического расширения ширины и высоты в IE6
$ .support.LeadingWhitespace
<html> <head> <meta charset = "utf-8"/> <title> совместимый </title> </head> <body> <script type = "text/javascript"> window.l = (function () {var el = document.createlement ("div"), index = 0; el.style.csstext = document.createlement ("div"), index = 0; «Планировка: 10px; фиксированное; Через Createlement в нижней части версии ParentNode; </script> IE678 автоматически фильтруют пространства до и после элемента, а пространства не включены в ChildNodes, <script type = "text/javascript"> var el = document.createElement ("div"); el.innerhtml = "<div id =/" null/"> </div>"; l (el.childnodes.length); </script> </body> </html>Стандартные браузеры придерживаются пользовательского ввода, а EL должен содержать три узла : ["", "<div id =/" null/"> </div>", ""] node;
В IE678 есть только 1 узел, и этот узел является Div:
$ .support.Checkon
Значение по умолчанию в флажке в стандартных браузерах - «ON», а IE5678 также «включен», но в некоторых веб -сабках значение значения по умолчанию по умолчанию «на строке», а текущая версия браузера очень высока, в основном нет проблем. Если у вас низкая версия Chrome, вы можете использовать следующую демонстрацию, чтобы проверить, есть ли какая -либо проблема:
<html> <head> <meta charset = "utf-8"/> <title> совместимый </title> </head> <body> <script type = "text/javascript"> window.l = (function () {var el = document.createlement ("div"), index = 0; el.style.csstext = document.createlement ("div"), index = 0; «Планировка: 10px; Положение: фиксированное; 0; справа: 0; ); </script> <input id = "ck" type = 'fackbox'/> <script type = "text/javascript"> var el = document.getelementbyid ("ck"); // стандартный браузер имеет событие изменения; el.onchange = function () {l (el.value); l (Ck.Checked)} // универсальное event propertyChange в IE; el.onpropertychange = function () {l (el.value); l (ck.checked)} l (el.value); </script> </body> </html>$ .support.tbody
Создать новую таблицу в IE6, и IE7 автоматически создаст элемент TBOM;
Если мы добавим TR или TD в созданную таблицу, то все браузеры автоматически создадут tBody;
Если это динамически созданная таблица и TR и добавьте TR в TBODY, то TBOD вообще не выйдет. Все браузеры следуют операциям разработчиков (разум браузера действительно трудно догадаться)
<html> <head> <meta charset = "utf-8"/> <title> совместимый </title> </head> <body> <script type = "text/javascript"> window.l = (function () {var el = document.createlement ("div"), index = 0; el.style.csstext = document.createlement ("div"), index = 0; «Планировка: 10px; Положение: фиксированное; 0; справа: 0; ); </script> <div id = "tb"> </div> <div id = "tb2"> </div> <div id = "tb3"> </div> <script type = "text/javascript"> var el = document.getelementbyid ("tb"); el.innerhtml = "<table> </table>" // IE67 выведет 1. Стандартный браузер следует за вводом пользователя и не будет автоматически генерировать тел, поэтому длина Tobdy составляет 0 л (el.getelementsbytagname ("tbody"). Длина); </script> <script> var el = document.getElementById ("tb2"); el.innerhtml = "<table> <tr> 111 </tr> </table>"; // будь то стандарт или IE67 автоматически генерирует тег TBody L (el.getElementsBytagName ("tbody"). Длина); </script> <script> var el = document.getElementbyId ("tb3"); el.innerhtml = "<table> <td> 111 </td> </table>"; // будь то стандарт или IE67 автоматически генерирует тег TBody L (el.getElementsBytagName ("tbody"). Длина); </script> <script> var tb = document.createElement ("таблица"); var tr = document.createElement ("tr"); tr.innerhtml = "trrtrtr"; TB.AppendChild (TR); document.getElementsbytagname ("body") [0] .appendChild (TB); </script> </body> </html>После того, как код будет выполнен, вы увидите, что, когда в таблице нет элементов, Chrome не генерирует тел. Если вы не напишите таблицу в соответствии с обычным методом письма, это так
"<table><tr>111</tr></table>";
Сгенерированный HTML становится таким, как « 111<table><tr></tr></table>“， в JQ вы пишете $(“<table><tr>111</tr></table>”)， и сгенерированный HTML также похож на этот ["111","<table><tr></tr></table>"]， так что я повторяю, что написание nefly с ht -taclards с ht -nectdards, так что я повторяю, что написание nebly speclords retring of taglords, так что я повторяю.
Еще одно исключение в IE. Tbody будет автоматически добавлен через Innerhtml , и если вы неправильно гнезете свои теги, он не будет заботиться о вас. Метод AppendChild не будет активно генерировать, как другие браузеры;
$ .support.htmlserialize
Browser IE678 не может динамически генерировать теги ссылки через Innerhtml. Чтобы создать их, создав новые теги:
<html> <head> <meta charset = "utf-8"/> <title> совместимый </title> </head> <body> <script type = "text/javascript"> window.l = (function () {var el = document.createlement ("div"), index = 0; el.style.csstext = document.createlement ("div"), index = 0; «Планировка: 10px; Положение: фиксированное; 0; справа: 0; ); </script> <div> Bounce </div> <div id = "link"> </div> <script type = "text/javascript"> var elink = document.getelementbyid ("link"); elink.innerhtml = '<link href = "http://cdn.bootcss.com/animate.css/3.3.0/animate.css" rel = "styleSheet">'; </script> </body> </html>Хотя большинство тегов ссылок могут быть сгенерированы через Innerhtml, нам невозможно генерировать теги скрипта через Innerhtml:
1 2next page Прочитайте полный текст