- типы данных number и string;
- методы документа write() и writeln();
- склеивание строк и переменных
Числа и строки
Давайте немножко изменим предыдущий скрипт:
<html>
<head>
<title>Пример 2</title>
</head>
<body>
<script type="text/javascript">
<!--
var х = "5";
var y = х + "3";
alert(y);
// -->
</script>
</body>
</html>
|
Нашли различие?
А теперь посмотрим результат
Почему это произошло? Потому что сложились не числа, а строки.
Для того, чтобы компьютер правильно интерпретировал наши данные, они
подразделяются на типы.
Во всех языках программирования существуют различные типы данных. В JavaScript
таких типов 6, и их классификация заметно отличается от той, что
распространена в большинстве языков. Сейчас нам важны два из них: number
(число) и string (строка). Number
всегда обозначается просто числом. А string — любым
выражением, заключённым в кавычки. Всё, что заключено в кавычки,
читается как набор символов: букв, цифр или других каких значков. При
сложении строк к одному набору приклеивается другой. Так, к нашей
пятёрке приклеилась тройка.
Кавычки можно использовать как двойные, так и одиночные. Бывает, что
одни кавычки надо вложить в другие, как в моём примере со ссылкой из
прошлого урока. Напомню:
|
<a href="javascript:
alert('Страница в разработке');">Пункт
меню</a>
|
Здесь в двойные кавычки заключено значение атрибута href тэга <a>,
а строка для вложенного в него метода alert()
заключена в одиночные кавычки.
А кстати, как Вы думаете, что выскочит, если последнюю строку скрипта
записать как alert("y")?
А что делать, если мы хотим отобразить кавычки в сообщении? Например:
Страница "Новости" ещё не готова.
Для этого перед каждой отображаемой кавычкой нужно поставить обратный
слэш — «\».
<script type="text/javascript">
alert
("Страница \"Новости\"
ещё не готова");
</script>
|
НО:
Если мы запихнём это в ссылку,
|
<a href="javascript:
alert('Страница \"Новости\" ещё не готова');">Новости</a>
|
то нам выдадут ошибку, потому что HTML этих обозначений не понимает.
А можно ли что-нибудь сделать? Можно. Обмануть HTML. Как?
Нужно просто изменить стиль кавычек: внешние сделать одиночными, а
внутренние — двойными:
|
<a href='javascript: alert("Страница \"Новости\" ещё не
готова");'>Новости</a>
|
Правда, редактор HomeSite выдаст алогичную подсветку кода (как у
меня в примере), но браузер всё поймёт правильно.
Но я больше люблю для таких дел использовать родные российские (хотя
вообще-то «французские») кавычки («»). На клавиатуре они набираются
ALT+0171 и ALT+0187. Их можно внедрить тремя способами:
- Просто набрать с помощью ALT:
|
<a href="javascript:
alert('Страница «Новости» ещё не готова');">Новости</a>
|
- Указать их как символы Unicode:
|
<a href="javascript:
alert('Страница «Новости»
ещё не готова');">Новости</a>
|
- Воспользоваться спецсимволами HTML:
|
<a href="javascript:
alert('Страница «Новости»
ещё не готова');">Новости</a>
|
Примечание: последний способ отображает тот стиль кавычек,
который используется в национальных настройках Windows. Так что те, у
кого Window английские, увидят другие кавычки.
Пишем прямо в документ
А теперь ещё изменим скрипт, а заодно познакомимся с новым(и)
методом(/ами).
<script type="text/javascript">
var х = 5;
var y = х + 3;
document.writeln("<h2
align='center'>" + y + "</h2>");
</script>
|
или
<script type="text/javascript">
var х = "авто";
var y = х + "ручка";
document.write("<h2
align='center'>" + y + "</h2>");
</script>
|
Для наглядности использования этих методов я включил туда и тэг HTML
(кстати, вот опять необходимость двух уровней разных кавычек). Да,
таким образом можно загнать в скрипт целую web-страницу (только нельзя
разбивать строку, то есть весь код HTML, загнанный в метод,
должен быть написан одной длинной строкой). Правда, для удобства можно
многократно использовать этот метод:
<script type="text/javascript">
document.writeln("[первый кусок
кода HTML]")
document.writeln("[второй кусок
кода HTML]")
document.writeln("[третий кусок
кода HTML]")
document.writeln("[и т.д.]")
</script>
|
В первом и последнем случаях я использовал метод документа writeln(),
а во втором — также метод документа, но write().
В чём разница?
Почти ни в чём. Долгое время я не мог понять разницы не находил ответов в
руководствах (так и не нашёл). Но методом случайного тыка выяснил, что
если написать:
<script type="text/javascript">
document.write("слово")
document.write("слово")
document.write("слово")
document.write("слово")
</script>
|
браузер выдаст:
словословословослово
А если написать:
<script type="text/javascript">
document.writeln("слово")
document.writeln("слово")
document.writeln("слово")
document.writeln("слово")
</script>
|
то выйдет:
слово слово слово слово
Кроме того, если первый из этих скриптов заключить в тэг <pre></pre>,
то ничего не произойдёт. А со вторым сработает:
слово
слово
слово
слово
То есть получается, что метод write() просто выводит
данные, содержащиеся в нём, а метод writeln() (как я
понимаю, это означает «write line» — «писать строку») представляет их
как строку кода HTML, что реально отражается в браузере как текст
с последующим пробелом. Таким образом, в моём примере с кусками кода
целесообразнее использовать writeln(): на странице это в
большинстве случаев никак не отразится, но именно с такой разбивкой мы
вводим HTML-код руками.
И ещё немного о сложении строк
Метод document.write() может содержать как и
непосредственно строки (взятые в кавычки), так и имена переменных,
содержащих строки (имена переменных вводятся в метод без кавычек). Можно
комбинировать и то, и другое.
Например:
<html>
<head>
<title>Пример 3</title>
<script type="text/javascript">
var
a = "
понедельник", b = "о вторник", c = " среду", d =
" четверг", e = " пятницу", f
= " субботу", g =
" воскресенье", h = " узнаете
свежие новости.", i = " увидите новые
поступления.";
</script>
</head>
<body>
<script type="text/javascript">
document.write("Заходите к нам в"
+ a + ", и
Вы" + h + "<br>")
document.write("Заходите к нам в"
+ b + ", и
Вы" + i + "<br>")
document.write("Заходите к нам в"
+ d + ", и
Вы" + h + "<br>")
document.write("Заходите к нам в"
+ f + ", и
Вы" + i)
</script>
</body>
</html>
|
Обратите внимание на «химию» при написании «во вторник», которая
позволяет внедрить изменённый вариант предлога, не нарушая общего
алгоритма (например, если бы повторяющийся текст нам захотелось загнать в
переменные).
(Все перечисленные в объявлении переменные нужно писать в одну длинную
строку. Если в document.write() не ввести тэг
<br>, то весь отображаемый текст будет в одну строку.)
С помощью JavaScript можно также сделать, чтобы нужные значения
автоматически вставлялись и изменялись в зависимости от текущей даты или
от страницы, на которой этот текст находится. Когда мы дойдём до
изучения этих возможностей, то ещё вернёмся к этой болванке.
Итак, мы узнали:
что такое числовой и строковый типы данных, как использовать методы document.write()
и document.writeln(), как складывать строки с
переменными.
А также:
как обмануть HTML, используя в тэге спецсимволы языка JavaScript.
К следующему уроку
>>
| 
Всего: 5499
