Правила     Закладки     Карма    Календарь    Журналы    Помощь    Поиск    PDA    Чат   
     
 

Все статьи:


1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 51, 52, 53, 54, 55, 56, 57, 58, 59, 60, 61, 62, 63, 64, 65, 66, 67, 68, 69, 70, 71, 72, 73, 74, 75, 76, 77, 78, 79, 80, 81, 82, 83, 84, 85, 86

JS0: Введение


Жабаскрипт, кроссбраузерность и тому подобное


    vasa_c 17.03.2007 - 21:58
Так как предыдущий опус вызвал некоторый интерес у отдельных товарищей, позволю себе пографоманить еще немного.

Если получится, попробую организовать некий «цикл статей» по JS. smile.gif
В первую очередь для того, чтобы самому как-то систематизировать данные. А, кроме того, возможно, и еще кому-то это будет полезно.

JavaScript : введение
  • о чем это
  • история, версии, стандарты
  • кроссбраузерность. к чему стремиться
О чем данный текст?

Наверное, не удивлю – о javascript. Лучше перефразировать вопрос: «что вся эта писанина несет умного, доброго, вечного и, что самое главное, оригинального»? Так как написать очередные «основы javascript» или даже очередной «полный справочник», это не оригинально, да и вообще бессмысленно. Потому что основ и справочников, стандартов и их переводов существует более чем достаточно.

Существовать-то существует, но, как показывает практика, очень многие моменты вызывают у очень многих людей очень большие затруднения. А какого-то «ну вообще, полного справочника» еще никто не написал. Вот и приходится каждому, кто заинтересовался данным языком, выковыривать крупицы знаний из недр Сети. Я за последние пару лет, что-то для себя наковырял и готов поделиться smile.gif

Что здесь, возможно, будет и чего не будет

Большинство авторов очень любят начинать свои книжки с описания основ программирования. Переменные, циклы, правильное кодирование (ставьте вместо пробелов табуляторы, или будете гореть в аду). Изведут на это кипу бумаги и мегабайт дискового пространства, а когда дойдут до по-настоящему важных и интересных вещей их порыв иссякает. Даже книжку «процессор Intel в защищенном режиме» без рассказов «для самых маленьких» не оставят.

Вот этого здесь не будет. Более того, здесь не будет даже стандартного описания javascript. Основы языка, документация по функциям – в мануалы и справочники. Здесь я попробую остановиться на «темных» моментах языка и попытаться показать, что на самом деле никакие они не темные, а сам javascript кристально чистый язык smile.gif. На глубоко технических деталях реализации останавливаться, по возможности, не буду (тем более что сам далеко не во всех разбираюсь), а попытаюсь дать общий обзор с указанием направлений, в которых следует копать.

Язык JavaScript, история, версии, стандарты

Все рассказы о JS, обычно, начинаются с фразы «javascript это не java!». После чего, однако, говорится о том, что синтаксис JS и Java сходен и является «си-подобным синтаксисом», вследствие чего, человек, работавший с Си, должен легко освоить JavaScript. И, правда, си-программистам легко дается первоначальное знакомство с JS. А вот более глубокое знакомство дается уже труднее. И в какой-то момент простой перенос приемов из Си на JavaScript вообще останавливает дальнейший рост «сишников», как «жеесников». Так вот, с самого начала заявляю:

JavaScript это нифига не Си!

У него абсолютно другая область применения и абсолютно другая идеология. Если понять и принять эту идеологию, то JavaScript будет для вас прекрасным языком, а если не понять, то будет сплошным мучением.

JavaScript, JScript, ECMAScript

Ну и конечно вначале всех книг о JS следует рассказ о ее нелегкой истории, о «войне браузеров» и других подобных вещах. После чего идет большая таблица со списком версий и браузеров.

Обычно из всего этого читатель выносит немного и все что он выносит достаточно печально. Оказывается, версий JavaScript лес густой, кроме того есть JScript со своим списком версий. Все эти версии имеют специфические отличия, а как версии JScript и JavaScript соотносятся между собой так вообще непонятно. А где-то сбоку еще есть ECMAScript, которая то ли стандарт, то ли новая версия JS, то ли синоним. Т.е. с первого взгляда, кажется, что написать более-менее сложный код, который бы работал в большинстве браузеров практически невозможно. На самом деле все гораздо проще.

ECMAScript

JavaScript это язык сценариев. Он не является самодостаточным языком программирования. То, что написано на нем не является полноценной программой, а является сценарием, исполняемым в каком-то окружении. JavaScript (или, вернее, ECMAScript) задействован во многих приложениях. То, о чем мы тут с вами говорим, является лишь одной его разновидностью, так называемым «клиентским javascript». Кроме как клиентский, он использовался, как серверный язык в умершем нетскейповском сервере. JScript, как серверный язык живет и поныне в майкрософтском IIS. JS использует Windows Script Hosting и даже Flash. Он является средством автоматизации во многих программах. А впрочем, даже вы можете взять исходники у Mozilla и внедрить его в свою программу.

JavaScript в браузере состоит из ядра и интерфейса взаимодействия с окружающей средой (под которой подразумевается браузер и отображаемый документ). Все, что может ядро, это производить внутренние вычисления и обмениваться данными с окружением. Никаких встроенных средств общения с внешней средой (например, операции ввода/вывода) у ядра JS нет – только через окружение. Например, действие, всеми нами любимой, функции alert() заключается в выброске на экран модального окошка с текстом. Это окошко является компонентом интерфейса браузера. Нигде, кроме браузера, данное действие не имеет смысла. Кому серверный JavaScript будет показывать окошки? Системному администратору в терминальном режиме? Поэтому функция alert() не является частью ядра языка, а предоставляется окружением. Так же методы работы с DOM – они работают со структурой документа, отображаемого в браузере и не имеют смысла за его пределами.

И есть такой стандарт - ECMA-262. Описывает он язык сценариев ECMAScript. Именно на этом стандарте и основывается ядро JavaScript. В этом стандарте описаны все внутренние вещи – переменные, типы, структуры данных и кода, объектная модель. Кроме того, даются определения встроенных объектов и функций общего назначения – функции работы со строками, например. Описано все это в достаточно общем плане, и в некоторых местах допускает различные толкования. Никакой канонической реализации стандарта ecma-262 (канонического языка ECMAScript) нет – ядро javascript это одна из возможных реализаций.

Последней редакцией стандарта на данный момент является 3-я, принятая, если не считать некоторые последующие дополнения, в 1999 году. На протяжении уже весьма долгого времени нам обещают 4-ю редакцию (т.н. JavaScript 2.0) в котором намечается огромное число новых фич. Однако, редакции этой пока нет, и даже появившись, до поддержки в браузерах дело дойдет очень не скоро. Так что про нее можно забыть, тем более, что разрабатывается она скорее даже не для классического клиентского javascript.

Актуальные браузеры

Возвращаясь к проблеме кроссбраузерности определим, а какие вообще браузеры следует поддерживать. Рассмотрим основные модели.

Internet, мать его, Explorer

Как бы нам этого не хотелось, но отказаться от поддержки наиболее популярного браузера в обычных веб-приложениях нельзя.

Сейчас вышла 7-я версия, но бал по прежнему правит 6-я. К сожалению, еще в достаточном количестве уцелели IE 5.5. А к счастью, IE 5.0 уже практически покинули этот мир.

Так вот, уже IE 5.5 (самая древняя версия о которой следует заботиться) в достаточно строгом виде поддерживает 3-ю редакцию ECMA.

Netscape, Mozilla, FireFox

Классический Netscape пал смертью храбрых в неравной схватке с Microsoft в конце прошлого века, остановившись на версии 4.8. Все «классические» версии давно устарели и их поддержкой заморачиваться не стоит.

После поражения Netscape открыл свои исходники и организовал проект «Mozilla». В его рамках был разработан движок Gecko. «Голый Gecko» состоит из драйвера отрисовки страниц и движка JavaScript. Поверх него создается интерфейс каждого конкретного браузера, плагины и другие навороты.

На Gecko основаны браузеры Mozilla, FireFox и возрожденный Netscape. Главное, что нам здесь нужно понимать, это то, что, несмотря на все поверхностные навороты, движок у них одинаковый. Т.е. отрисовывают страницы и исполняют JS они одинаково. Т.е. нам, веб-разработчикам, насиловать мозги совместимостью между этими браузерами не стоит.

Еще одна приятная вещь здесь, что те, кто скачал и установил себе FireFox, скорее всего, скачает себе новую версию (или поставит это на автомат). Если вполне возможны ситуации, что в какой-то конторе 7 лет назад поставили машины с виндуз-линолиум с 5-м ИЕ и они так до сих пор и стоят, то здесь ситуация гораздо лучше. Вышло новое обновление, либо заплатка - можно быть уверенным, что через достаточно непродолжительное время, она будет везде.

Все актуальные версии Gecko-браузеров строго реализуют 3-ю редакцию ECMAScript.

Opera

Опера всегда славилась, тем, что изобретала различные забавные примочки и, не успев их реализовать в полной мере и отладить, кидалась реализовывать другие. При этом со стандартами дело обстояло достаточно туго. Однако, в последнее время ситуация начала налаживаться.

Все актуальные версии Opera достаточно хорошо реализуют 3-ю редакцию ECMAScript.

DOM

Кроме ядра языка нас так же интересует и взаимодействие с окружением, т.е. браузером и отображаемым документом. Основное здесь, конечно, стандарт DOM. Данный стандарт состоит из частей (уровней):

DOM0: к этому «псевдоуровню» относят средства работы с документом реализованные в древних браузерах. Это document.all[], anchors[] и тому подобное. В различных браузерах данный уровень был реализован по разному. Последние версии браузеров поддерживают его и даже предоставляют совместимость с другими браузерами (В FF реализован document.all). Однако, единственный совет по достижению кроссбраузерности на данном уровне – не использовать его.

DOM1: описывает работу с деревом элементов документа. Обеспечивает создание, доступ и манипуляции с элементами. Реализован в полной мере во всех актуальных браузерах.

DOM2: дополняет DOM1 и расширяет его поддержкой стилей и событийной моделью. Есть некоторые расхождения в различных браузерах. Например, в IE несколько другая модель событий. Однако, в большинстве случаев эту модель можно рассматривать, как урезанную версию DOM-модели, чего для большинства задач вполне хватает. Большинство действительно распространенных операций из данного уровня поддерживается всеми актуальными браузерами.

DOM3: Содержит много интересных фишек, но поддержка всеми браузерами еще очень далека от совершенства. Впрочем, в большинстве стандартных задач возможности данного уровня не нужны.

Выводы

Из всей этой писанины можно сделать один вывод – все актуальные браузеры поддерживают основные стандарты связанные с клиентским javascript (ECMA-262 3-й версии и DOM до 2-го уровня). Т.е, если писать в соответствии с ними, никаких проблем в достижении кроссбраузерности не возникает.

В некоторых местах все же придется делать ветвления для различных браузеров, но это будет редко и по сравнению с ситуацией прошедших времен, когда нужно было делать одно глобальное ветвление, по типу, программа для IE, программа для NN, все это не так страшно.

Конечно, есть огромное число примочек в каждом конкретном браузере, которые позволяют сделать жизнь лучше и веселее. Но это уже другая история.

Блин, а где Safari?

А не написал я о Safari, т.к. достаточно редко удается смотреть результаты в нем. А есть еще множество менее популярных браузеров, а с ними КПК, мобильники и много чего другого, где JS вообще не работает.

Поэтому для себя я выработал основной принцип кроссбраузерности – пусть это все работает на голом HTML. А уже сверху вешаются js-примочки, в том объеме, который поддерживает данный клиент. Т.е. даже человек без JS, пусть и не увидит «всей этой крррасоты», но хоть как-то сайт функционировать у него будет. Поэтому я не просыпаюсь по ночам в поту «а что если на мой сайт придут с мобильного телефона, что же будет?!». Чего и всем желаю.