Html как сделать ссылку без подчёркивания



Главная - Уроки - Уроки JavaScript


  • как вставить скрипт в документ HTML (общие сведения);
  • комментарии в JavaScript;
  • как объявлять переменные и давать им правильные имена;
  • разбор скрипта и синтаксис методов;
  • метод alert();
  • полезная мелочь: «заглушка» на временно не работающую ссылку

В создании web-страниц есть много разных тонкостей. Но есть и три кита. Это HTML, CSS и JavaScript.

Рекомендую организовать самообразование следующим образом: как только освоите синтаксис HTML и научитесь делать примитивные странички с текстом, картинками и таблицами, сразу подключайтесь к изучению CSS. Как только поймёте, как работать с CSS, начинайте осваивать JavaScript, параллельно пополняя «словарный запас» во всех трёх языках. Думаю, что через полгода сможете построить весьма красивый и функциональный сайт.

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

Попался мне как-то учебник Вадима Дунаева. Многие, я знаю, ругают этот учебник. Кроме того, я скачл мерзко отсканированный PDF, где вместо "()" могло оказаться, например, "Q", а латинские буквы в кодах заменены (местами!) аналогичными русскими, из-за чего эти коды не работают. В общем, пришлось попыхтеть. И, честно скажу, если бы я до этого ничего не читал про JavaScript, то в этих ошибках бы не разобрался и присоединился бы к числу ругателей. Но я тогда сидел без работы, было время вникнуть, и учебник мне понравился. Но он очень подробный и рассчитан на людей, которые уже с программированием соприкасались.

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

Итак:

Вставка в документ HTML

Вы наверняка видели в HTML-кодах такие тэги:

Вот эта абракадабра между тэгами и есть скрипт.

Сам тэг <script> относится к языку HTML, и у него могут быть следующие атрибуты:

  • language
  • type
  • src

Этот атрибут необязателен. Его стоит использовать либо для уточнения версии языка (javascript1.1, javascript1.2 и т.п.), либо если используешь другой язык (например, <script language=VBscript">). То есть вреда этот атрибут в любом случае не принесёт, но в стандартной ситуации он вроде как лишний.

Атрибут type, который указывает на тип текста: text/javascript. Он появился в версии HTML 4.0. Его-то я и рекомендую использовать.

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

В любые. Но с умом.

Часто в скрипте указывается вывод конкретного текста, что называется, здесь и сейчас. Такой скрипт вставляется прямо в <body>, «на место происшествия».

Бывают скрипты с объявлениями переменных, которые могут быть использованы в других скриптах на странице, с функциями, которые можно вызвать из любого места кода HTML. Такие скрипты разумнее всего помещать между тэгами <head> и </head>.

Но можно сделать и так, чтобы использовать скрипт сразу на нескольких web-страницах. Для этого его код нужно записать в отдельный файл с расширением .js (например, myscript_1.js). Тэги <script> и </script> писать в нём уже не надо.

И вот тогда-то, для вызова скрипта с web-страницы, нам и понадобится атрибут src. Работает он так же, как и аналогичный атрибут тэга <img>:

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

Можно также вставлять маленькие скрипты в некоторые атрибуты тэгов HTML, но об этом — чуть позже.

Комментарии

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

Так вот, чтобы не вываливалась, мы заключаем её в HTML-комментарии.

Ммм... а что это за два слэша перед закрытием комментария?

Закрывающий комментарий находится уже в «теле» скрипта. А JavaScript не понимает этих корявых HTML'ских скобок, для него это инородное тело, генерирующее ошибку. Значит, нужно скрыть этот закрывающий тэг от скрипта, поместив его как комментарий JavaScript. У JavaScript комментарии выглядят несколько изящнее: //. После этого знака скрипт не видит закрывающую скобку HTML, а HTML благополучно скрывает текст скрипта, и на экране не видно никаких «левых» записей.

Раз уж мы коснулись комментариев, то надо сказать, что в JavaScript они имеют две формы — такие же, как в C и C++ (а кстати и в CSS тоже).

// Эта форма комментария // действует только на одну строку, // то есть на каждой новой строке // нужно выставлять знак комментария. А это уже код скрипта... / А эта форма комментария действует на сколько угодно строк до тех пор, пока не натолкнётся на закрывающий значок, зеркально отражающий начальный. / А теперь опять код скрипта...

Не путайте комментарии HTML и комментарии JavaScript! Это разные языки, хотя и сосуществуют «в одном флаконе». Или, точнее, в одной банке. Как пауки...

Вернёмся к проблеме ветхих браузеров. Допустим, с помощью JavaScript Вы сделали из двух картинок что-то вроде анимированного баннера. Тогда Вы можете порадовать пользователей «убогих» браузеров (а Вы, я надеюсь, не полностью лишены альтруизма) лицезрением хотя бы одной из этих картинок с помощью тэга <noscript>:

В каких редакторах писать скрипты

Возможно, существуют какие-то специальные редакторы для JavaScript. Я таких не встречал да и не слишком искал. Обычно скрипты пишут в тех же редакторах, какие используют для создания web-страниц. Я, например, люблю HomeSite. Написание скрипта в этих редакторах ничем не отличается от написания его в простом блокноте, кроме подсветки кода. А она иногда очень помогает. Скачал я однажды скрипт (у какого-то немца), а он не работает. Присмотрелся к коду и увидел, что ключевое слово switch почему-то не выделено. Гляжу — а там не switch, а switsch, Donner, Wetter! Убрал буковку — и поехало.

Кстати, во всех наших примерах код выглядит именно так, как в окне HomeSite.

С места в карьер

Следующий пример — плагиат у Дунаева. Но он настолько прост и глубок, что не могу удержаться. Я добавил сюда только некоторые детали оформления записи, чтобы объяснить заодно и их.

Сразу предупреждаю: практически этот пример абсолютно бесполезный. Но в нём сконцентрированы многие ключевые понятия языка javascript и его синтаксиса.

Собственно скрипт

Если Вы скопируете этот код в чистую страницу Блокнота и сохраните её как файл.html, то при открытии файла увидите следующее:

Разберём, как это выходит.

var х = 5;

Здесь мы объявляем переменную x, которая равна 5.

Стоп! А знаете ли Вы, что такое переменная?

Если нет, то нажмите эту ссылочку и прочитайте пояснение.

Как работает компьютер? Все данные сохраняются на диске, и место, где они лежат, должно быть помечено, чтобы было ясно, где что искать. Любая программа (а скрипт — это не что иное, как маленькая программа) работает с какими-то данными. Поэтому удобно сразу «забить место» для них. Вот этим местом, этим помеченным участком памяти и становится переменная. Почему «переменная»? Потому что этот участок может заполняться разными значениями. Например, когда мы работаем с калькулятором, то числа и действия с ними, которые мы вводим, записываются программой в соответствующие переменные. А при нажатии кнопки выполнения вступает в действие алгоритм, использующий те значения, которые мы ввели.

В коде программы переменные обозначаются именами, которые мы сами для них придумываем. Для создания имён существуют определённые правила, которые в разных языках программирования могут отличаться. Те ограничения, которые будут описаны ниже, относятся конкретно к языку JavaScript.

Закрыть пояснение.

var — ключевое слово для объявления переменной (по-английски variable).
x — имя переменной.

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

Правильные имена переменных:

myVar
my_var
text01
_text
button12bis

Неправильные имена переменных:

my Var
my-var
01text
текст01

Язык JavaScript чувствителен к регистру.

myvar, MyVar и myVar — разные переменные.

(Кстати, насчёт регистра. Само название языка пишется с большими J и S: JavaScript. Существует заблуждение, что именно так и надо писать это слово в тэгах HTML. Но HTML к регистру не чувствителен, поэтому там можно писать, как заблагорассудится. Я привык маленькими, как и мой любимый HomeSite, кто-то — большими.)

В этом скрипте переменной сразу при объявлении присваивается значение. Это не обязательно. Значение можно присвоить и позже. В конце строки стоит точка с запятой. Это в данном случае тоже не обязательно. Но в больших и сложных скриптах это иногда оказывается важным, поэтому я демонстрирую полную подробную запись. У Дунаева эта строка выглядит просто x = 5, явное объявление var здесь тоже не обязательно. Но (имхо) всё-таки желательно.

В следующей строке, как Вы уже можете догадаться, объявлена переменная y. Ей присвоено значение относительно уже объявленной x, на 3 больше, чем x.

А затем вызывается метод alert().

Этот метод выводит на экран окно диалога с сообщением, указанным в скобках. Это синтаксис всех методов javascript: имя метода и скобки с его содержимым.

Содержимое этого метода — значение переменной y, и в окне диалога мы увидим восьмёрку. Поняли, почему?

Полезная мелочь

Раз уж мы с Вами познакомились с методом alert(), то вот его простое и полезное применение: иногда какие-то страницы сайта ещё не сделаны, а ссылки уже приготовлены. Неприятно бывает попадать на «страницу 404». Не очень также приятно ждать, пока она загрузится, а потом узнать, что раздел в разработке. Я всегда затыкаю подобные ссылки следующим образом:

Пункт меню

Кстати, вот вам ещё один способ внедрения кода JavaScript в код HTML. Здесь он вставляется в атрибут href тэга ссылки и вводится через ключевое слово «javascript: » (с двоеточием и последующим пробелом: всегда обращайте внимание на синтаксические мелочи). Обратите также внимание на традиционные двойные кавычки значения атрибута HTML и «вложенные» одиночные кавычки в тексте самого скрипта.

Очень скоро мы узнаем и о специальных «событийных» атрибутах тэгов HTML, например, onClick, которые специально предназначены для введения кода JavaScript и не требуют ключевого слова.

Итак, мы узнали:

как объявить скрипт в документе HTML, какие формы имеют комментарии JavaScript, как объявлять переменные и давать им правильные имена, а также синтаксис методов и конкретно метод alert().

А также научились:

ставить «заглушку» на ссылку в виде сообщения alert().

К следующему уроку >>

К списку уроков JavaScript

(© А. Фролов)

 

© 2003 - все права защищены, перепечатка статей запрещена


Закрыть ... [X]

Справка о подтверждающих документах: валютный Фото нежно розового цвета маникюра

Html как сделать ссылку без подчёркивания Html как сделать ссылку без подчёркивания Html как сделать ссылку без подчёркивания Html как сделать ссылку без подчёркивания Html как сделать ссылку без подчёркивания Html как сделать ссылку без подчёркивания Html как сделать ссылку без подчёркивания Html как сделать ссылку без подчёркивания