Понимая, что тем, кто знаком с HTML читать будет не интересно, я всё же сдержу обещание и буду давать максимально подробные объяснения.

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

Ключевое понятие языка HTML разметки — так называемый «тэг». Есть понятие открывающего тэга и закрывающего. Для части тэгов предусмотрено обязательное наличие закрывающего тэга, для части — нет. Тэги — это по сути любые слова, заключённые в треугольные скобки. Само это слово — название тэга. Закрывающий тэг должен начинаться с символа "/". Всё, что находится между закрывающим и открывающим тэгом, относится к этому тэгу.

Первое, что мы видим в нашем примере — тэг html. Соответствующий ему закрывающий тэг находится в самом конце. Этот тэг указывает, что внутри него (между открывающим и закрывающим тэгом) используется html разметка. Логично, что весь наш документ внутри этого тэга.

Далее следует тэг head. Он отвечает за всевозможную служебную информацию о документе. Оставим его пустым, поставив сразу за ним соответствующий закрывающий тэг, для нас он сейчас не важен.

Наконец мы добрались до тэга body. Именно там находится то, что мы видим на экране. Например, текст, написанный напрямую в этом тэге (не находящийся во вложенных тэгах и не содержащий служебных символов) сразу выводится на экран в том же виде, в котором введён в исходном коде страницы.

Внутри тэга body мы просто написали текст, который при запуске будет выведен на экран. Всё просто, кроме одного маленького нюанса. Между двумя предложениями мы натыкаемся на новый тэг <br>. Этот тэг отвечает за начало новой строки.

но это, как вы понимаете длиннее.

Так что же такое переменная? Попробую объяснить на пальцах. Переменная — это нечто, имеющее имя и соответствующее ему значение. Например, вы родились 29 ноября. Тогда имя соответствующей переменной «число вашего рождения», я её значение — 29 ноября (только не пробуйте именовать переменные кириллицей или используя пробелы, так делать нельзя, я так назвал для удобства, а вот «dateOfYouBirth», если я не ошибся в правописании, которое у меня, как и у Винни Пуха хромает, хотя оно есть, вполне нормальное название для этой переменной).

Другой не плохой пример из реальной жизни — счёт в банке, у него есть номер и на нем есть какое–то количество средств. Номер тут — имя переменной, а количество средств — значение. Мы можем изменить значение этой переменной, например, всё потратив.

Так вот, в первой строке я объявил переменную rowCount и присвоил ей значение 10. Во второй строке я проделал то же самое с переменной colCount. Эти переменные будут нам задавать количество строк и колонок в нашей таблице, можете поменять их значения и увидите, что будет.

В следующей строке опять много нового, но потерпите, зато в этой главе мы сможем разобраться с куда большим количеством понятий, чем в остальных. По–моему, оно того стоит. Итак: " var tbl = document.getElementById(«tbl»);". Тут мы объявляем переменную «tbl», она в последствии позволит нам управлять нашей табличкой и присваиваем ей выражение «document.getElementById(«tbl»)».

Тут мы впервые вскользь коснемся такого понятия как ООП (объектно ориентированное программирование). Собственно мы попробуем упрощённо определить, что такое объект в контексте ООП.

Объект — это по сути переменная, которая содержит в себе другие переменные и функции. Они также называются полями и методами соответственно. Так вот, слово «document» в нашем выражении — это название переменной, уже до выполнения скрипта объявленной самой JavaScript, которая соответствует объекту, который предоставляет доступ к нашему документу. По сути, он позволяет JavaScript коду работать с  HTML кодом в рамках одного документа.

Немного запутанно? Надеюсь станет понятнее, когда мы перейдём к примерам, не пытайтесь понять всё сразу, это на самом деле довольно сложные вещи, которым посвящено большое количество весьма увесистых книг. Для понимания этого примера важно понять, что есть некая переменная «document» и что с помощью неё мы можем как–то взаимодействовать с элементами нашей странички, в нашем примере это будет таблица.

Ещё пару слов про объекты, как я уже говорил, у них есть поля и методы. Но как к ним обращаться? В JavaScript, как и во многих других языках программирования, к ним принято обращаться через точку. То есть, например, наше выражение «document.getElementById» можно прочитать как «метод getElementById объекта document». Следует понимать, что у разных документов этот метод вернёт скорее всего разный результат, так как он возвращает элемент именно этого того документа, переменная которого находится перед точкой.

Так что же в результате делает метод «getElementById»? Как и следует из названия, он возвращает контрол, «id» которого (элемент, соответствующий тэгу, в котором атрибут id которого) передается в скобках.

Кстати то, что передаётся в скобках после названия функции (метода), тоже имеет своё название. В прошлый раз, когда я говорил о функциях, я это пропустил, так как скобки у нас были пустые, а теперь, придётся упомянуть. В круглых скобках после названия функции передаются её параметры. У функции может быть один или несколько параметров, может совсем не быть параметров. В случае нескольких параметров, в JavaScript они разделяются запятыми. В случае отсутствия параметров, скобки остаются пустыми.

В данном случае, функция требует передачи одного строкового параметра, соответствующего идентификатору (id) элемента.

В результате выполнения строчки, мы получили в переменной «tbl» объект, с помощью которого мы сможем управлять нашей таблицей (получим доступ к нашей таблице).

Следующая строка — снова не простое, но фундаментальное понятие — цикл. Циклы бывают нескольких видов и предназначены для выполнения части кода несколько раз. Основное отличие циклов в том, как формулируется условие прекращения цикла (выхода из цикла).

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

Давайте попробуем прочитать нашу строчку по–русски: «for (var i = 0; i < rowCount; i++)». Я бы её перевёл как «выполнять следующий блок кода и каждый раз увеличивать переменную «i» на единицу до тех пор, пока её значение остаётся меньше значения переменной «rowCount» (количества строк в нашей таблице). Блок, принадлежащий этому циклу также заканчивается в самом конце функции.

Далее идёт строка «var row = tbl.insertRow(i);". Там мы переменной «row» присваивает результат метода объекта нашей таблицы «insertRow» с нашей переменной цикла «i» в качестве. параметра. По аналогии с тем, что мы видели ранее, данный метод делает то, что следует из его названия, а именно, добавляет новую строку в таблицу. Причём, когда i = 5, строка добавляется так, что становится пятой (после четвёртой), ну и так далее.

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

Далее идёт новый цикл с переменной цикла «j», который выполняется colCount раз. Когда один цикл выполняется внутри другого, последний называется вложенным циклом.

Отличительной его особенностью является то, что его тело выполняется во столько раз чаще, чем если бы он не был вложенным, сколько раз выполняется внешний цикл. То есть в нашем случае тело этого цикла будет выполняться rowCount * colCount раз, или, другими словами, на каждую строку по числу колонок.

Первая строка внутри этого цикла: «var cell = row.insertCell(j);" создаёт новую ячейку в строке row нашей таблицы и присваивает её переменной cell. Вторая строка: «cell.innerHTML = 'cell' + i.toString() + j.toString();" присваивает полю innerHTML нашей ячейки строку «cell» + значение переменной «i», переведённая в строку вызовом метода «toString», плюс значение переменной «j», также в виде строки. Чтобы различать строки и названия функций, переменных и прочие куски кода, строки в JavaScript принято заключать в апострофы или двойные кавычки. Причём, если вы хотите использовать апострофы внутри строки — следует добавить перед ними символ "\". В случае с двойными кавычками можно этого не делать, если сама строка заключена в апострофы.

Что ещё может быть не понятно? Вероятно поле «innerHTML». По сути это фрагмент HTML кода, который вы программным образом присваиваете тэгу контрола. Так как в этой главе и так было не мало информации, думаю будет достаточно указать на то, что с помощью этого тэга мы изменяем надпись, которая будет отображаться в нашей ячейке.

Глава оказалась длиннее, чем я рассчитывал. Сильно длиннее, но в ней было затронуто много основополагающих аспектов программирования и, по правде сказать, затронуты весьма поверхностно. Так или иначе, в будущем постараюсь, чтобы новых элементов в главе встречалось меньше.

    function fillMines(rowCount, colCount, minesCount)

    {

      var res = new Array(rowCount * colCount);

      var mines = minesCount;

      while (mines > 0)

      {

        var n = intRand(rowCount * colCount‑1);

        if (res[n] != 1)

        {

          res[n] = 1;

          mines--;

}

}

      return res;

}

       this.intRand = function(maxVal)

      {

        return Math.floor((maxVal‑1) * Math.random() + 0.5) — 1;

}

this.intRand = function(maxVal)

{

return Math.floor((maxVal‑1) * Math.random() + 0.5) — 1;

}

                      cell.innerHTML = '?';

                      function SetCellClick(i, j)

                      {cell.onclick= function() {checkCell(i, j)};};

                      SetCellClick(i, j);