На что следует обратить внимание при разработке кроссбраузерного JavaScript

1. Используйте элемент tbody при добавлении строк в таблицу,

чтобы определить таблицу и гарантировать, что ее смогут использовать все браузеры, включая IE.

Пример: Определите пустую таблицу следующим образом:

<table id="myTable">

<tbody id=". myTableBody"></ tbody>

</table>

Правильный способ добавления строк в эту таблицу — добавлять строки в тело таблицы, а не в саму таблицу.

Var cell = document.createElement("td").appendChild(document.createTextNode("foo"));

Var row = document.createElement("tr").appendChild(cell);

Document.getElementById("myTableBody"). AppendChild(row);

*В IE необходимо сначала создать строки, затем создать столбцы, а затем создать контент.

2.

Установите стиль элемента.

Var spanElement = document.getElementById("mySpan");

метод записи гарантированно будет работать во всех браузерах, кроме IE. Доступно

spanElement.setAttribute("style","font-weight:bold;color:red;");

//Следующий метод записи гарантирует, что IE может использовать

spanElement.style. cssText="font-weight:bold;color:red;";

3. Установите атрибут класса элемента

Var element = document.getElementById(“myElement”);

//Следующий метод записи гарантирует, что все браузеры, кроме IE, могут его использовать.

Element.setAttribute("class","styleClass");

//Следующий метод записи. Убедитесь, что IE доступен в

Element.setAttribute("className","styleClass");

4. Создайте элементы ввода

Var button = document.createElement( "input");

//Однострочное текстовое поле, флажок, переключатель, переключатель. Кнопкам нужен этот атрибут, чтобы различать

Button.setAttribute("type","button");

Document.getElementById("formElement"). AppendChild(button);

5. Добавьте обработчик события к элементу ввода

Var formElement=document.getElementById(" formElement"

// Доступно во всех браузерах

formElement.onclick=function(){doFoo();}

// Доступно во всех браузерах, кроме IE

formElement.setAttribute("onclick","doFoo();");

6. Создайте переключательIf

(document.uniqueID){

//Internet Explorer

Var radioButton=document.createElement("<input type=' radio' name='radioButton' value='checked'>");

}else{

/ /Соответствует стандартам

Var radioButton=document.createElement("input");

radioButton.setAttribute("type","radio");

radioButton. setAttribute("name","radioButton");

radioButton.setAttribute("value","checked”);

}

7. InsertRow, InsertCell, deleteRow

В IE, если table.insertRow() не указывает параметры, строки будут добавлены после таблицы бит параметра по умолчанию равен -1; если в Firefox, необходимо добавить параметры, например: InsertRow(-1).