ANTICHAT.XYZ    VIDEO.ANTICHAT.XYZ    НОВЫЕ СООБЩЕНИЯ    ФОРУМ  
Баннер 1   Баннер 2
Antichat снова доступен.
Форум Antichat (Античат) возвращается и снова открыт для пользователей. Здесь обсуждаются безопасность, программирование, технологии и многое другое. Сообщество снова собирается вместе.
Новый адрес: forum.antichat.xyz
Вернуться   Форум АНТИЧАТ > ИНФО > Статьи > Авторские статьи
   
Ответ
 
Опции темы Поиск в этой теме Опции просмотра

Основы JavaScript
  #1  
Старый 10.05.2006, 12:01
Аватар для .Slip
.Slip
Leaders of Antichat - Level 4
Регистрация: 16.01.2006
Сообщений: 1,966
Провел на форуме:
21768337

Репутация: 3486


По умолчанию Основы JavaScript

Немного основных понятий JavaScript..
Тех, кто чувствует себя в яваскриптах как рыба в воде, просьба не опускать этот небольшой сбор основ яваскриптов. Я понимаю, что много людей на форуме это всё знают, но ведь есть и те, кто хочет что то почерпнуть новое. Вот этот сбор для них. В общем по стандартному шаблону "для новичков".

Во первых, не нужно путать JavaScript и Java — это две большие разницы!

Java-это мощный платформо-независимый язык программирования высокого уровня, который имеет широкие возможности для использования в Интернете из-за своей функциональности, простоты и безопасности. Но он используется в виде откомпилированных приложений-апплетов либо Java веб-служб, в отличии от JavaScript.

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

Этот язык был разработан фирмой Netscape, следовательно, первым JavaScript стал поддерживать именно ихний Navigator. Потом к нему присоединился также и микрософтовский "осёл", в реализацию объектной модели которого его создатели, конечно же, добавили несколько своих собственных фич.

JavaScript является очень удобным средством для реализации функциональных и удобных веб-страниц с обратной связью, реагирующих на действия юзверя. Можно создавать симпатичные менюшки с "переворачивающимися" пунктами-картинками (вы наверняка видели такие на каком-нибуть сайте), вставлять на страницу такие полезные елементы, как часы, календарь, даже калькулятор (пригодится на каком-нибуть финансовом сайте, или инет-магазине).

В основе функциональности JavaScript лежит так называемая DOM (от Document Object Model, объектная модель документа).

Эта модель в объектном виде хранит целую кучу свойств веб-страницы и окна броузера. Это, например, такие свойства, как цвет фона страницы, адрес документа, в отдельных коллекциях (массивах) хранятся все рисунки (images) и якоря-ссылки(anchors) страницы.

Изменить либо ещё как-то повлиять на эти свойства можно с помощью методов (или функций) — например:
Код:
document.write("Hello? World!!!");
Здесь использована функция-метод write объекта document для вывода сообщения на страницу. Это только простейший пример использования методов.

Метод — это член какого-либо объекта, который выполняет какие либо действия с объектом, подобно функциям.

Особое отношение в JavaScript к переменным — в этом языке нет строгого контроля типов. При объявлении переменной выполняющая среда автоматически определяет её тип по инициализирующему значению. То есть, если переменной присваивается численное значение, то тип переменной определяется, как int (целочисленное значение) либо float (дробное с плавающей запятой). Следовательно...
В JavaScript нет строгой типизации переменных.
Несмотря на эти упрощения, на JavaScript можно писать довольно функциональные программы, которые могут упростить посетителям работу с вашим сайтом. Теперь несколько учебных примеров.

Обработка событий

В языке JavaScript есть такой способ написания программ, как обработка событий, то есть выполнение каких-либо функций в ответ на событие.

Событие (event) — генерируется в ответ на некоторые действия пользователя либо среды выполнения (окна броузера, состояния документа)

Используя этот прием, можно, например, выделять активные элементы на странице при помощи изменения цвета элемента:

Код:
function change_color(element, color) {
// вызывается в ответ на наведение курсора мыши:
// <div onmouseover="change_color(this, 'red');"
// onmouseout="change_color(this, 'black');">
// ........
// </div>
element.style.color = color;
}
Но не обязательно менять именно цвет. JavaScript позволяет делать ещё очень многое с элементами документа.

И ещё на пример:
Код:
<span style="width: 200px; border: 1px solid black;
text-align: right" onmouseover="this.innerText='ЛОЛ';"
onmouseout="this.innerText='А ТЕПЕРЬ ЕЩЁ РАЗ!';">
НАВЕДИ СЮДА!
</span>
Сделать скрин небыло возможности, так что просто попробуйте вставить этот код в тело страницы.
И делается это всё с помощью свойства innerText, которое содержит текст из элемента.

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

Вот и всё, конечно таких вот "сборов сведений" в сети пруд пруди, но если кто то узнал что то новое, то это значит что я не зря это всё писал
 
Ответить с цитированием

  #2  
Старый 10.05.2006, 14:52
Аватар для 0x00
0x00
Новичок
Регистрация: 06.04.2006
Сообщений: 27
Провел на форуме:
85657

Репутация: 9
По умолчанию

Выше сказанное может только подтолкнуть к углубленному изучению, уж если писать, то целый учебник.
Молодец. Держи знаменитый "+"
 
Ответить с цитированием

  #3  
Старый 10.05.2006, 17:00
Аватар для Dracula4ever
Dracula4ever
Постоянный
Регистрация: 08.05.2006
Сообщений: 559
Провел на форуме:
1593567

Репутация: 354


Отправить сообщение для Dracula4ever с помощью ICQ Отправить сообщение для Dracula4ever с помощью AIM Отправить сообщение для Dracula4ever с помощью Yahoo
По умолчанию

Мог рассказать и про Alert,Confirm,prompt и про многово другово.
но молодец!
 
Ответить с цитированием

Продолжение:)
  #4  
Старый 12.05.2006, 11:49
Аватар для .Slip
.Slip
Leaders of Antichat - Level 4
Регистрация: 16.01.2006
Сообщений: 1,966
Провел на форуме:
21768337

Репутация: 3486


По умолчанию Продолжение:)

Сейчас я вас ознакомлю с использованием методов confirm() & prompt()..

Метод confirm в JavaScript


Команда confirm (подтвердить) действует очень похоже на alert, за исключением того,
что добавляет кнопку "Отмена" в диалоговое окно. И то, и другое - методы.

Одна команда сама по себе многого не дает. Нет никакой разницы,
что вы выбираете - "ОК" или "ОТМЕНА". Но стоит добавить функции IF (если) и ELSE (иначе), и готовы отличные эффекты.

Код:
<SCRIPT LANGUAGE="javascript">
confirm("Уверены, что хотите войти?")
</SCRIPT>
Знакомо? Пора бы уже. То же самое, что и alert, кроме слова confirm.
Вот основной пример того, что делает скрипт. Как видите, немного. Но вот вам та же команда с некоторыми добавлениями:

Код:
<SCRIPT LANGUAGE="javascript">
if (confirm("Вам туда надо?")) {
	parent.location='отправляете юзверя на какой либо URL';
	alert("Ну тогда идите");
	}
else {
	alert("Сиди тогда тут");
	}
</SCRIPT>
У вас есть выбор
Во-первых, скрипт говорит:

if (confirm("Вам туда надо?") );

Это значит Если (Здесь ваш шанс сделать выбор)

В нашем случае сonfirm предлагает альтернативу: <OK> и <Отмена>. Можно сказать, Да и Нет.
Обратите внимание на скобки. После команды IF всегда идут скобки,
но, как известно, команды сonfirm тоже требует скобок.
Следовательно, берем две пары скобок, одна внутри другой.

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

{parent.location='опять же посылаете куда либо юзверя';
alert("Ну тогда идите");}


parent.location означает обычную ссылку. Дальше идет обыкновенная команда alert.
PS. после каждой команды в хтмл документе, не забывайте ставить ;

А что если я выберу отмену?
Мы уже знаем, что если выбрать ОК, запускается функция IF (если). Отмена - другой выбор. Видите, сразу после фигурной скобки идет команда ELSE (иначе), как бы <если нет>. И тогда следующий текст...

else {
alert("Cиди тогда тут");
}


...означает: если нет, тогда вызвать окно и не менять страницу.

Все это вместе и дает пользователю возможность выбора: входить или не входить.

Вот и всё что представляет собой простой метод confirm...

Про alert писать не буду, потому что не представляю, что там может быть непонятного)
=====================

Использование метода prompt()

Метод prompt() несколько отличается от методов alert() и confirm()..
Он дает возможность пользователю вписать собственный ответ на вопрос,
вместо того чтобы просто выводить на экран информацию (как в методе alert()) или делать выбор между
кнопками OK и Cancel (как в методе confirm()).

Пример. Метод prompt() вводят в сценарий так же, как и методы "алерт" и "конфирм".
Сначала добавьте prompt() в блок SCRIPT:

Код:
<script language="JavaScript">prompt()</script>
С этого момента ввод метода prompt()начинает отличаться от ввода методов "алерт" и "конфирм" (в лом регистр переключать+)),
поскольку в круглые скобки требуется добавить две фразы.
Первая из них - сообщение, которое должно быть выведено на экран
Делается это так же, как и в методах "алерт" и "конфирм".
Текст в кавычках помещается внутри круглых скобок:

Код:
<script language="JavaScript"> 
prompt("Как вас зовут?")
</script>
Сохраните вашу страницу и просмотрите ее в браузере.
Обратите внимание на появившийся запрос об имени пользователя.
Вы можете ввести имя и щелкнуть по одной из кнопок выбора ОК или CANCEL.

Обратите внимание, появится слово undefined (не определено) в поле ввода.
Это особенность "осла". В браузере Netscape поле ввода остается пустым

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

Следующая единица ввода - это текст по умолчанию,
который должен появиться в соответствующем поле.
Добавить его очень просто, а заодно это позволит избавиться от появления undefined в "ослике".

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

Код:
<script language="JavaScript">  
prompt("Как вас зовут?", "Введите здесь ваше имя")  
</script>
Сохраните вашу страницу и еще раз обновите вид в браузере.
Заметьте, что поле ввода больше не является пустым (Netscape), а содержит текст, указанный во второй паре кавычек
И в "осле" теперь на месте ввода пишет: "Введите ваше имя"


И при вводе какого либо имени (не обязательно имени+)) в окне браузера оно успешно отобразится)

Теперь вы уже знаете 2 немаловажных метода в JavaScript: confirm() & prompt()..
Пишу я понемногу, т.к. тем кто только
начал изучать JavaScript, будет легче всё это переварить)

В следующий раз, я выложу основу синтаксиса JavaScript.. Ждите
__________________
..
 
Ответить с цитированием

  #5  
Старый 12.05.2006, 12:06
Аватар для Azazel
Azazel
Заведующий всем
Регистрация: 17.04.2005
Сообщений: 1,062
Провел на форуме:
5957900

Репутация: 561


По умолчанию

Неплохая статья. Только меня очень рассмешило
Цитата:
Метод — это член какого-либо объекта, который выполняет какие либо действия с объектом, подобно функциям.
__________________
Full DNS report
 
Ответить с цитированием

  #6  
Старый 13.05.2006, 10:55
Аватар для Федя
Федя
Новичок
Регистрация: 10.05.2006
Сообщений: 16
Провел на форуме:
19120

Репутация: 1
По умолчанию

Респект! Неплохая статья! В следующий раз TALKни чёньть про
window.open()
а также
while(){}
 
Ответить с цитированием

  #7  
Старый 13.05.2006, 11:03
Аватар для Dracula4ever
Dracula4ever
Постоянный
Регистрация: 08.05.2006
Сообщений: 559
Провел на форуме:
1593567

Репутация: 354


Отправить сообщение для Dracula4ever с помощью ICQ Отправить сообщение для Dracula4ever с помощью AIM Отправить сообщение для Dracula4ever с помощью Yahoo
По умолчанию

Цитата:
Сообщение от Федя  
Респект! Неплохая статья! В следующий раз TALKни чёньть про
window.open()
а также
while(){}
И про то как делать часы в JavaScript
 
Ответить с цитированием

  #8  
Старый 13.05.2006, 13:03
Аватар для CinerX
CinerX
Познающий
Регистрация: 13.02.2006
Сообщений: 82
Провел на форуме:
539650

Репутация: 37
По умолчанию

Цитата:
И про то как делать часы в JavaScript
Вот самые простые часики... На их написание ушли 1-2 минуты =)
Код:
<script>
function myTime(){
x = new Date() // создаем обьект даты
Hours = x.getHours() // Метод getHours()
Minutes = x.getMinutes() // Метод getMinutes()
Seconds = x.getSeconds() // Метод getSeconds()

   if (Minutes < 10)
      Minutes = "0"+Minutes // делаем красивее Минуты
   if (Seconds < 10)
      Seconds = "0"+Seconds // делаем красивее секунды

document.Form_Name.text.value = Hours+":"+Minutes+":"+Seconds; // выводи результат

}
setInterval("myTime()", 1000) // вызываем функцию myTime() каждую секунду
</script>

<form name="Form_Name">
    <input type=text name="text">
</form>
 
Ответить с цитированием

Продолжение 2
  #9  
Старый 13.05.2006, 17:19
Аватар для .Slip
.Slip
Leaders of Antichat - Level 4
Регистрация: 16.01.2006
Сообщений: 1,966
Провел на форуме:
21768337

Репутация: 3486


Smile Продолжение 2

Итак, как обещал выкладываю основу синтаксиса языка JavaScript... Написал в этот раз я немного)
Начали:

Синтаксис JavaScript и Java сделан по образцу C и C++. Отметим основные правила:

Чувствительность к регистру Все ключевые слова пишутся в нижнем регистре. Все переменные и названия функций пишутся точно так же, как и были определены (например, переменные Str и str являются разными переменными))

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

Символ точка с запятой (;). Все операторы должны быть разделены этим символом. Если оператор завершается переводом строки, то точку с запятой можно опустить. При этом нужно следить за тем, чтобы при разрыве строки одного оператора, новая строка не начиналась бы с самостоятельного оператора.

Комментарии. JavaScript игнорирует любой текст расположенный между символами /* и */. Также игнорируется текст начинающийся символами // и заканчивающийся концом строки.

Индентификаторы. Индентификаторами являются имена переменных, функций, а также меток. Индентификаторы образуются из любого количества букв ASCII, подчеркивания (_) и символа доллара ($). Первым символом не может быть цифра, а в версии JavaScript 1.0 не допускается использования и символа $.

Ключевые слова. Ключевые слова не могут использоваться в качестве индетификаторов. Ключевыми словами являются: break, case, continue, default, delete, do, else, export, false, for, function, if, import, in, new, null, return, switch, this, true, typeof, with.

Вот и всё) Скоро добавлю ещё что нибудь важное..

Цитата:
И про то как делать часы в JavaScript
Нет) Я учить что то делать не буду) Делать вы будите сами, если захотите.. Я только могу выложить основы, а дальше все смогут пойти сами) Зайди на вувеб, там этих часов горами..)
__________________
..
 
Ответить с цитированием

  #10  
Старый 13.05.2006, 18:19
Аватар для Дикс
Дикс
Познавший АНТИЧАТ
Регистрация: 16.04.2006
Сообщений: 1,488
Провел на форуме:
2209675

Репутация: 537


Отправить сообщение для Дикс с помощью ICQ
По умолчанию

Цитата:
(в лом регистр переключать+)),
раскладку
а вообще данная инфа есть в более удобоваримом виде на первых страницах
любого учебника по яваскрипт за 25р.
вторая часть не понравилась. слишком мало инфы и слишком муторно изложено.
воды много.

у меня вопрос - я как то пытался изучить яваскрипт, синтаксис там в принципе понятный, но я так и не научился на нём кодить потому что в двух купленных книжках не было простого перечисления всех объектов, их свойств и методов.
так и приходится обо всём узнавать по крупицам из подобных статей в инете.
из первой статьи sL(IP)--!(P.i.N.) например узнал про innerText
дайте плз ссылку на список всех объектов, свойств и методов яваскрипта.
 
Ответить с цитированием
Ответ



Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Система авторизации на Javascript Xex Авторские статьи 3 26.04.2006 13:42
Books JS FRAGNATIC PHP, PERL, MySQL, JavaScript 0 11.08.2005 16:57
Bypassing JavaScript Filters the Flash! Attack k00p3r Чужие Статьи 0 12.07.2005 16:11
Основы "власти" в чате Чаты 15 16.10.2002 12:46



Здесь присутствуют: 1 (пользователей: 0 , гостей: 1)
 


Быстрый переход




ANTICHAT.XYZ