Content:
General
Security/hack
Programming
Art/Stuff
 
 
наша рассылка
Твой E-mail:
Submit
 
 
  Примеры технологии Java Script
 
 
  У каждого языка есть свои достоинства и недостатки, но исключать его вообще из использования – это верх кощунства!
Есть такие люди, кто недооценивает и даже не любит технологию java script. Да бывает, скажите вы. Но такого вида «маразм», в моем понимании, доходит не только до отключения java script в опциях браузера, но и в ярых требованиях от всех и вся писать всё без java script. Самое забавное во всем этом, что аргументировать сии доводы такие господа толи просто не могут, толи просто не хотят. В итоге получаются отговорки типа: «а мой КПК не поддерживает java script и значит его не надо юзать». Хм, пожалуй, трудно найти такой КПК, не правда ли? И не пора ли его менять раз уж он такой юродивый?
По своему горькому опыту случалось встречаться с такими людьми, к ещё большому сожалению, они ещё при всем при этом оказывались и заказчиками проекта…хоть вешайся при работе с такими…Но всё это лирика, сейчас посмотрим некоторые простые возможности великого java script, а кто не с нами тот против нас – пусть покинет мир…:)

Ну а что же такое java script и откуда он произошел? Язык изобрел Brendan Eich из компании Netscape и назвал его JavaScript. Первые раз новый язык был использован в браузере Netscape Navigator 2.0. А дальше пошло-поехало, поддержка языка далее была реализована во всех браузерах от Netscape, а также в браузерах от Microsoft, начиная с Internet Explorer 3.0. Более того, Microsoft как всегда засотелось засветится и они развили идею языка по-своему, назвав свой вариант коротко - JScript.

Чтобы не было хаоса, Генеральной Ассамблеей ECMA был создан некий стандарт языка, чтобы обеспечить совместимость независимых разработчиков, а также других компаний занимающихся разработкой новой технологию Но стоит заметить, что сам стандарт всё же базировался на технологиях выше упомянутых JavaScript (от Netscape) и JScript (от Microsoft). Первый вариант стандарта был принят ещё в июне 1997. В наши дни все белые люди используют третье издание именуемое ECMA-262, которое включает в себя много нового. Это и мощные обработку строк, регулярные выражений, новые инструкции контроля и управления, перехват и обработку исключительных ситуаций, и многое-многое другое. Язык всё ещё развивается, что не может не радовать :) Ещё следует отметить, что в IE по сравнению c Netscape больше соответствия рекомендациям ECMA-262, да и поддерживаемых возможностей тоже. Но тем не менее, друзья, юзайте Opera и будет мир и процветание на Земле :)

Иной раз бывает, что в разных браузерах дизайн отображается по разному или некоторые функции просто-напросто не работают в одном браузере, зато хороши в другом. Простой пример из жизни, буквально недавно столкнулся с выводом вертикального текста на экран. Для Осла есть специальная функция для такого рода вывода, а вот для любимой Opera нет. Но так как злобный заказчик использует продукты Microsoft'a, то и делать пришлось под него, ну а для Opera извращаться как только можно. Следовательно в зависимости от браузера зависит и выводимая страница. Смотрим как это делается средствами java script.
Данные скрипт посылает пользователей Opera на одну страницу, а пользователей Explorer'a - на другую.

В строке location необходимо заменить url_for_opera.html на свой url для страницы Opera, а url_for_ie.html - для Explorer.

<html>
<head><title>Какой у вас браузер?</title>
<script language="JavaScript">
var n=navigator.appName
var opera=(n=="Opera")
var ie=(n=="Microsoft Internet Explorer")
if (opera)
location="url_for_opera.html"
else if (ie)
location="url_for_ie.html"
</script>
</head>
<body>
<h1>Делаем редикт в зависимости от браузера :) </h1>
</body>
</html>

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

<html>
<head><title>Случайная ссылка</title>
<SCRIPT LANGUAGE="JavaScript">
<!--
function randomlink(){
var a=Math.round(Math.random()*3);
url = new Array();
url[0]="url_1.html";
url[1]="url_2.html";
url[2]="url_3.html";
url[3]="url_4.html";
location=url[a];
}
//-->
</script>
</head>
<body>
<form> <p><input type="button" name="url" value="Поехали" onclick="randomlink()"></p></form>
</body>
</html>

Элементарный эффект с кнопочкой радио. :)

<FORM>
<INPUT TYPE="radio" NAME="radio" value="Текст сообщения 1"
onClick="alert(value)">2: <INPUT TYPE="radio" NAME="radio" value="Вы нажали 2"
onClick="alert(value)">3: <INPUT TYPE="radio" NAME="radio" value="Вы нажали 3"
onClick="alert(value)"></FORM>
 

Формочка отправки url.


<script language="JavaScript">
function mailMe( form ) {
alert(' Действительно этого хочешь? ')
return true;
}
</script>

А в блок <BODY> вставим что-то типа этого:
<form name="myform" method="POST" action="mailto:ВАШ EMAIL?subject=ТЕМА" onSubmit="return mailMe( this.form )" enctype="text/plain" encoding="windows-1251">
URL:<br>
<input type="text" name="URL" value="http://" size=30><br>
<input type="submit" value="Послать URL">
</form>

А теперь сделаем вывод афоризма на каждый день недели. Это довольно просто и тем не менее приятно для пользователей. Как ни крути а всё-таки что-то разнообразное...

Скрипт помещаем в <BODY>:
 

<script language="JavaScript">
nowDate=new Date();
theDay=nowDate.getDay();
text=new Array(30);
text[0]="Совершенство характера выражается в том, чтобы каждый день проводить, как последний в жизни. (Марк Аврелий)";
text[1]="Тот, кто не смотрит вперед, оказывается позади. (Джордж Герберт)";
text[2]="Человек, которому повезло, - это человек, который делал то, что другие только собирались делать. (Жюль Ренар)";
text[3]="Если вы недовольны тем местом, которое занимаете - смените его! Вы же не дерево! (Джим Рон)";
text[4]="Не смерти должен бояться человек. Он должен бояться никогда не начать жить. (Марк Аврелий)";
text[5]="Думаете ли вы, что у вас получится, или думаете, что нет – вы правы. (Генри Форд)";
text[6]="Человек - все равно, что кирпич; обжигаясь, он становится твердым. (Джордж Бернард Шоу)";
document.write(text[theDay]);
</script>

Выведем сообщение как только пользователь опустит мышь под изображение :)

Суем это в <HEAD>и</HEAD>:
<script>
function loadalert ()
{
alert("Тут пишем наше сообщение")
}
</script>

Остально в <BODY>:
<CENTER>
<a href="http://www.image.ru/" ONMOUSEOVER = "loadalert ()">
<IMG border=0 width=125 height=100 SRC = "ПУТЬ К КАРТИНКЕ" ALT="Наша картинка">
</a></CENTER>

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

В <BODY> засовываем саму функицию

<script language="JavaScript">
var k;
imgprint=кол-во баннеров;
imgall=номер последнего баннера ;
var ran=new Array(imgprint-1);
function random_number(){
return Math.round(Math.random() * imgall);
}
function check(num){
while(k!=num){
ran[num]=random_number();
k=0;
for(a=0;a<num;a++){
if(ran[a]!=ran[num]){
k++
}
}
}
}
ran[0]=random_number();
for(a=1;a<imgprint;a++){
check(a);
}
img=new Array(imgall);
link=new Array(imgall);
alt=new Array(imgall);
img[0]="Баннер 1"; link[0]="ссылка 0"; alt[0]="описание 0";
img[1]="Баннер 1"; link[1]="ссылка 1"; alt[1]="описание 1";
img[2]="Баннер 2"; link[2]="ссылка 2"; alt[2]="описание 2";
img[3]="Баннер 3"; link[3]="ссылка 3"; alt[3]="описание 3";
img[4]="Баннер 4"; link[4]="ссылка 4"; alt[4]="описание 4";
img[5]="Баннер 5"; link[5]="ссылка 5"; alt[5]="описание 5";
img[6]="Баннер 6"; link[6]="ссылка 6"; alt[6]="описание 6";
img[7]="Баннер 7"; link[7]="ссылка 7"; alt[7]="описание 7";
img[8]="Баннер 8"; link[8]="ссылка 8"; alt[8]="описание 8";
img[9]="Баннер 9"; link[9]="ссылка 9"; alt[9]="описание9";
for(i=0;i<imgprint;i++){
document.write('<a href="'+link[ran[i]]+'" target="_blank">');
document.write('<img width=88 height=31 border=0 src="'+img[ran[i]]+'"'); document.write('alt="'+alt[ran[i]]+'"></a>');
}
document.write('</center>');
</script>


Если у тебя есть сайт, а может форум, то пользователи часто любят подгружать картинки с других серверов, но вот незадача, если тот самый сервер не работает. Что будет в итоге? А ничего собственно, мы получим рамку от картинки и крестик. Тупо не правда ли? Сейчас всё поправим :)

Вот оно лекарство, скрипт заменяет неподгурзившуюся картинку на какую-то другую если сервер не работает.

В <img> суем такое: onError="this.src='адрес нашего изображения при возникновении ошибки'"

Ну и вся ссылка выглядит так:
<img src="адрес катринки" onError="this.src='адрес нашего изображения при возникновении ошибки'" height=125 width=100>

Я надеюсь, что примеры были очевидны даже тем, кто не знаком с java script. На таких простых примерах видно, что java script это довольно интересный язык, который дан в помощь web-программистам и отказывать от такого инструмента просто глупо...IMHO конечно...

.:: Special for Open Team E-zine ::.

Автор: latys

 
Интро | О проекте | Услуги | Статьи | Обратная связь
Freelance web designer