Начал изучать язык программирования javascript. Изучаю его не по книгам, а сразу на практике, то есть придумываю себе задания и делаю их. И вот всего за несколько дней изучения языка пришлось столкнуться с некоторыми проблемами и с некоторыми интересными фактами в javascript, о чём сегодня хочу поведать.

Самый короткий способ определения браузера IE

Все проблемы с javascript возникали у меня практически пока только с браузером Internet Explorer. Поэтому важно для IE писать отдельный обработчик или отдельную функцию. На хабре нашел самый короткий способ определения IE. Для этого необходимо всего-лишь задать следующую переменную:

IE = '\v'=='v'

Чтобы понять как использовать эту переменную, покажу на примере:

<script type="text/javascript">
var IE = '\v'=='v';
if (IE) {
   // здесь обработчик под IE
}
</script>

В чём смысл сравнения '\v'=='v' также оговаривался на хабре.

maxshopen: По стандарту слэш перед символом, игнорируется, если это не escape-последовательность. Поэтому \x и x — одно и тоже, а вот \v — это вертикальная табуляция. IE видимо её не поддерживает, отсюда и различие.

Метод innerHTML и табличные элементы в IE

Данный метод предназначен для динамического добавления в объект html-текста, то есть теги будут обрабатываться, а не выводиться обычным текстом.

К сожалению, если мы попробуем добавить что-то подобное:

document.getElementsByTagName('tbody')[0].innerHTML += '<tr><td>Первая ячейка</td><td>Вторая ячейка</td><td>Третья ячейка</td></tr>'

и запустить это в Internet Explorer, мы получим текст вида Первая ячейкаВторая ячейкаТретья ячейка. Всё это потому, что в IE невозможно создавать ячейки и строки таблицы через innerHTML. Из мануала Microsoft:

...The property is read/write for all objects except the following, for which it is read-only: COL, COLGROUP, FRAMESET, HTML, STYLE, TABLE, TBODY, TFOOT, THEAD, TITLE, TR...

Обхода этой ошибки пока я не знаю (по-моему, вообще нету обхода), поэтому советую не использовать табличную вёрстку при планировании работы с javascript.

Создание поля через javascript и реакция IE

Для создания обычного поля input в любом браузере используют примерно такой код:

var newinput = document.createElement('input')
newinput.type = 'text'
newinput.name = 'unknown'
document.getElementsByTagName('form')[0].appendChild(newinput)

Если во всех браузерах ошибок не возникнет, то в IE новое поле не появится. Всё дело в том, что в IE невозможно задать имя (а возможно и любые атрибуты?) и тип динамически созданного поля.

Для обхода этой проблемы я как-раз таки и искал способ определения браузера IE. Для создания подобного поля в IE используют такой код:

var newinput = document.createElement('<input type="text" name="unknown" />')
document.getElementsByTagName('form')[0].appendChild(newinput)

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

Изменение типа поля на file

Существует такая проблема, встречаемая на всех браузерах. Допустим на странице расположено поле типа file. С помощью команды

document.getElementsByTagName('input')[0].type = 'text'

можно изменить тип поля на text. Обратную же операцию совершить невозможно.

Обходил эту проблему я так. Удалял существующее поле и заново динамически создавал новое поле уже с типом file. Достаточно нудный способ, конечно, может кто знает по-лучше способ?

В общем говоря, во многих языках есть свои подводные камни и ошибки, но в javascript как-то много всего сразу наплыло. Интересно что дальше будет, много ли таких косяков с ним имеется?

Важный этап жизни проектов - раскрутка сайтов - должен производится профессионалами. Использовать возможность аутсорсинга умно и выгодно.