Вот что такое JavaScript (сборник базовых знаний JS)

Автор：Eve Cole Время обновления：2009-06-11 16:26:36

1 Создайте блок сценария

для ссылки на код программы контента.
<script Language="JavaScript">
Код JavaScript написан здесь
</script>

2 Скрыть код сценария
Программный код справочного контента
<script Language="JavaScript">

</скрипт>
Соответствующий код не будет выполняться в браузерах, не поддерживающих JavaScript

3. Отображается, когда браузер его не поддерживает.
Программный код справочного контента
<носкрипт>
Привет браузеру без JavaScript.
</noscript>

4 Связывание внешних файлов сценариев
Программный код справочного контента
<script Language="JavaScript" src="/"filename.js""></script>

5 Скрипт комментариев
Программный код справочного контента
// Это комментарий
document.write("Привет"); // Это комментарий.
/*
Все это
это комментарий
*/

6 Вывод в браузер
Программный код справочного контента
document.write(“<strong>Привет</strong>”);

7 Определить переменные
Программный код справочного контента
var myVariable = «некоторое значение»

8 сложение строк

;

Программный код справочного контента
var myString = «Строка1» + «Строка2»

9 Поиск строки

;

Программный код справочного контента
<script Language="JavaScript">

</script>

10 Замена строки
Программный код справочного контента
thisVar.replace("Понедельник", "Пятница");

11 Форматная строка
Программный код справочного контента
<script Language="JavaScript">

</script>

12 Создать массив
Программный код справочного контента
<script Language="JavaScript">

</script>

13 Сортировка массивов
Программный код справочного контента
<script Language="JavaScript">

</script>

14 Разделить строку
Программный код справочного контента
<script Language="JavaScript">

</script>

15 Всплывающее предупреждающее сообщение
Программный код справочного контента
<script Language="JavaScript">

</script>

16 Всплывающее окно подтверждения
Программный код справочного контента
<script Language="JavaScript">

</script>

17 Пользовательская функция
Программный код справочного контента
<script Language="JavaScript">

</script>

18 Вызов функции JS
Программный код справочного контента
<a href="#" onClick="functionName()">Текст ссылки</a>
<a href="/”javascript:functionName"()”>Текст ссылки</a>

19 Выполнить функцию после загрузки страницы
Программный код справочного контента
<body onLoad="имя_функции();">
Тело страницы
</body>

20 Условное суждение
Программный код справочного контента
<скрипт>

</script>

21 Укажите количество циклов
Программный код справочного контента
<скрипт>

</script>

22 Установить будущее выполнение
Программный код справочного контента
<скрипт>

</script>

23 Функция запланированного выполнения
Программный код справочного контента
<скрипт>

</script>

24 Отменить запланированное выполнение
Программный код справочного контента
<скрипт>

</script>

25 Выполнить функцию при выгрузке страницы
Программный код справочного контента
<body onUnload="имя_функции();">
Тело страницы
</body>

JavaScript выглядит следующим образом 2: Вывод браузера

26 Доступ к объекту документа
Программный код справочного контента
<script Language="JavaScript">
вар myURL = document.URL;
окно.alert(мойURL);
</script>

27 Динамический вывод HTML
Программный код справочного контента
<script Language="JavaScript">
document.write("<p>Вот некоторая информация об этом документе:</p>");
document.write("<ul>");
document.write("<li>Ссылающийся документ: " + document.referrer + "</li>");
document.write("<li>Домен: " + document.domain + "</li>");
document.write("<li>URL: " + document.URL + "</li>");
document.write("</ul>");
</script>

28 Вывод новой строки
Программный код справочного контента
document.writeln("<strong>a</strong>");
document.writeln("b");

29 дата вывода
Программный код справочного контента
<script Language="JavaScript">
вар thisDate = новая дата ();
document.write(thisDate.toString());
</script>

30 Укажите часовой пояс даты
Программный код справочного контента
<script Language="JavaScript">
вар myOffset = -2;
вар currentDate = новая дата();
вар userOffset = currentDate.getTimezoneOffset()/60;
вар timeZoneDifference = userOffset - myOffset;
currentDate.setHours(currentDate.getHours() + timeZoneDifference);
document.write("Время и дата в Центральной Европе: " + currentDate.toLocaleString());
</script>

31 Установить формат вывода даты
Программный код справочного контента
<script Language="JavaScript">
вар thisDate = новая дата ();
var thisTimeString = thisDate.getHours() + «:» + thisDate.getMinutes();
var thisDateString = thisDate.getFullYear() + «/» + thisDate.getMonth() + «/» + thisDate.getDate();
document.write(thisTimeString + «on» + thisDateString);
</script>

32 Чтение параметров URL
Программный код справочного контента
<script Language="JavaScript">
вар urlParts = document.URL.split("?");
varparameterParts = urlParts[1].split(“&”);
для (я = 0; я <parameterParts.length; я++) {
varpairParts =parameterParts[i].split("=");
вар ПараИмя = ПараЧасти[0];
вар PairValue = PairParts [1];
document.write(pairName + ": " +pairValue);
}
</скрипт>
Вы все еще думаете, что HTML не имеет состояния?

33 Откройте новый объект документа
Программный код справочного контента
<script Language="JavaScript">
функция новыйДокумент() {
документ.открыть();
document.write("<p>Это новый документ.</p>");
документ.закрыть();
}
</script>

Переход на 34 страницы
Программный код справочного контента
<script Language="JavaScript">
window.location = «http://www.x-force.cn/»;
</script>

35 Добавление окна прогресса загрузки веб-страницы
Программный код справочного контента
<html>
<голова>
<script Language='javaScript'>
var PlaceHolder = window.open('holder.html','placeholder','width=200,height=200');
</скрипт>
<title>Главная страница</title>
</голова>
<body onLoad='placeHolder.close()'>
<p>Это главная страница</p>
</тело>
</html>

Вот и все для JavaScript 3: Изображение

36. Чтение атрибутов изображения.
Программный код справочного контента
<img src="/”image1.jpg"” name="myImage">
<a href="# " onClick="window.alert(document.myImage.width)">Ширина</a>

37 Динамическая загрузка изображений
Программный код справочного контента
<script Language="JavaScript">
myImage = новое изображение;
myImage.src = «Tellers1.jpg»;
</script>

38 Простая замена изображений
Программный код справочного контента
<script Language="JavaScript">
rollImage = новое изображение;
rollImage.src = «rollImage1.jpg»;
defaultImage = новое изображение;
defaultImage.src = «image1.jpg»;
</скрипт>
<a href="/"myUrl"" onMouseOver="document.myImage.src =rollImage.src;"
onMouseOut="document.myImage.src = defaultImage.src;">
<img src="/"image1.jpg"" name="myImage" width=100 height=100 border=0>

39 Случайное отображение изображений
Программный код справочного контента
<script Language="JavaScript">
вар imageList = новый массив;
imageList[0] = "image1.jpg";
imageList[1] = "image2.jpg";
imageList[2] = "image3.jpg";
imageList[3] = "image4.jpg";
var imageChoice = Math.floor(Math.random() * imageList.length);
document.write('<img src="' + imageList[imageChoice] + '">');
</script>

40 Замена изображения, реализованная функцией
Программный код справочного контента
<script Language="JavaScript">
источник вар = 0;
замена вар = 1;
функция createRollOver(originalImage,replacementImage) {
вар imageArray = новый массив;
imageArray[источник] = новое изображение;
imageArray[source].src = originalImage;
imageArray[замена] = новое изображение;
imageArray[replacement].src = replaceImage;
вернуть массив изображений;
}
varrollImage = createRollOver("image1.jpg","rollImage1.jpg");
</скрипт>
<a href="#" onMouseOver="document.myImage1.src =rollImage1[replacement].src;"
onMouseOut="document.myImage1.src =rollImage1[source].src;">
<img src="/"image1.jpg"" width=100 name="myImage1" border=0>
</a>

41 Создание слайд-шоу
Программный код справочного контента
<script Language="JavaScript">
вар imageList = новый массив;
imageList[0] = новое изображение;
imageList[0].src = «image1.jpg»;
imageList[1] = новое изображение;
imageList[1].src = «image2.jpg»;
imageList[2] = новое изображение;
imageList[2].src = «image3.jpg»;
imageList[3] = новое изображение;
imageList[3].src = «image4.jpg»;
функция слайдшоу (imageNumber) {
document.slideShow.src = imageList[imageNumber].src;
номер изображения += 1;
если (imageNumber < imageList.length) {
window.setTimeout("slideShow(" + imageNumber + ")",3000);
}
}
</скрипт>
</голова>
<body onLoad="slideShow(0)">
<img src="/”image1.jpg"” width=100 name=”slideShow”>

42 случайных рекламных изображения
Программный код справочного контента
<script Language="JavaScript">
вар imageList = новый массив;
imageList[0] = "image1.jpg";
imageList[1] = "image2.jpg";
imageList[2] = "image3.jpg";
imageList[3] = "image4.jpg";
вар urlList = новый массив;
urlList[0] = "http://some.host/";
urlList[1] = "http://another.host/";
urlList[2] = "http://somewhere.else/";
urlList[3] = "http://right.here/";
var imageChoice = Math.floor(Math.random() * imageList.length);
document.write('<a href="' + urlList[imageChoice] + '"><img src="' + imageList[imageChoice] + '"></a>');
</script>

Вот и все для JavaScript 4: Форма

43. Состав формы.
Программный код справочного контента
<form Method="post" action="target.html" name="thisForm">
<input type="text" name="myText">
<select name="mySelect">
<option value="1">Первый выбор</option>
<option value="2">Второй вариант</option>
</выбрать>
<br>
<input type="отправить" value="Отправить меня">
</form>

44 Доступ к содержимому текстового поля в форме
Программный код справочного контента
<имя формы="myForm">
<input type="text" name="myText">
</форма>
<a href='#' onClick='window.alert(document.myForm.myText.value);'>Проверить текстовое поле</a>

45 Динамически копировать содержимое текстового поля
Программный код справочного контента
<имя формы="myForm">
Введите текст: <input type="text" name="myText"><br>
Копировать текст: <input type="text" name="copyText">
</форма>
<a href="#" onClick="document.myForm.copyText.value =
document.myForm.myText.value;”>Копировать текстовое поле</a>

46 Обнаружение изменений в текстовом поле
Программный код справочного контента
<form name="myForm">
Введите текст: <input type="text" name="myText" onChange="alert(this.value);">
</form>

47 Доступ к выбранному Выбрать
Программный код справочного контента
<form name="myForm">
<select name="mySelect">
<option value="Первый выбор">1</option>
<option value="Второй выбор">2</option>
<option value="Третий выбор">3</option>
</выбрать>
</форма>
<a href='#' onClick='alert(document.myForm.mySelect.value);'>Проверить список выбора</a>

48 Динамически добавлять элементы выбора
Программный код справочного контента
<form name="myForm">
<select name="mySelect">
<option value="Первый выбор">1</option>
<option value="Второй выбор">2</option>
</выбрать>
</форма>
<script Language="JavaScript">
document.myForm.mySelect.length++;
document.myForm.mySelect.options[document.myForm.mySelect.length - 1].text = «3»;
document.myForm.mySelect.options[document.myForm.mySelect.length - 1].value = «Третий выбор»;
</script>

49 Проверка полей формы
Программный код справочного контента
<script Language="JavaScript">
функция checkField(поле) {
если (field.value == "") {
window.alert(“Вы должны ввести значение в поле”);
поле.фокус();
}
}
</скрипт>
<form name="myForm" action="target.html">
Текстовое поле: <input type="text" name="myField" onBlur="checkField(this)">
<br><input type="отправить">
</form>

50 Проверка выбранных элементов
Программный код справочного контента
функция контрольный список (выбор) {
если (selection. length == 0) {
window.alert("Вы должны сделать выбор из списка.");
вернуть ложь;
}
вернуть истину;
}

51 Динамическое изменение действия формы
Программный код справочного контента
<form name="myForm" action="login.html">
Имя пользователя: <input type="text" name="username"><br>
Пароль: <input type="password" name="password"><br>
<input type="button" value="Login" onClick="this.form.submit();">
<input type="button" value="Register" onClick="this.form.action = 'register.html'; this.form.submit();">
<input type="button" value="Получить пароль" onClick="this.form.action = 'password.html'; this.form.submit();">
</form>

52 Использование кнопок изображений
Программный код справочного контента
<form name="myForm" action="login.html">
Имя пользователя: <input type="text" name="username"><br>
Пароль: <input type="password" name="password"><br>
<input type="image" src="/"login.gif"" value="Логин">
</form>

53 Шифрование данных формы
Программный код справочного контента
<SCRIPT LANGUAGE='JavaScript'>
<!--
функция шифрования (элемент) {
вар newItem = '';
for (i=0; i < item.length; i++) {
newItem += item.charCodeAt(i) + '.';
}
вернуть новый элемент;
}
функция encryptForm(myForm) {
for (i=0; i <myForm.elements.length; i++) {
myForm.elements[i].value = encrypt(myForm.elements[i].value);
}
}

//-->
</СКРИПТ>
<form name='myForm' onSubmit='encryptForm(this); window.alert(this.myField.value);'>
Введите текст: <input type=text name=myField><input type=submit>
</form>

Вот и все для JavaScript 5: Окно и фрейм

54. Изменение текстового запроса в строке состояния браузера.
Программный код справочного контента
<script Language="JavaScript">
window.status = «Новое сообщение о статусе»;
</script>

55 Всплывающее окно подтверждения
Программный код справочного контента
<script Language="JavaScript">
var userChoice = window.confirm («Нажмите «ОК» или «Отмена»);
если (выбор пользователя) {
document.write("Вы выбрали ОК");
} еще {
document.write("Вы выбрали Отмена");
}
</script>

56 Запрос на ввод
Программный код справочного контента
<script Language="JavaScript">
var userName = window.prompt("Пожалуйста, введите свое имя", "Введите свое имя здесь");
document.write("Ваше имя " + имя пользователя);
</script>

57 Открыть новое окно
Цитируемое содержимое //Открываем новый программный код окна браузера с именем myNewWindow
<script Language="JavaScript">
window.open("http://www.liu21st.com/","myNewWindow");
</script>

58 Установите размер нового окна
Программный код справочного контента
<script Language="JavaScript">
window.open("http://www.liu21st.com/","myNewWindow",'height=300,width=300');
</script>

59 Установите положение нового окна
Программный код справочного контента
<script Language="JavaScript">
window.open("http://www.liu21st.com/","myNewWindow",'height=300,width=300,left=200,screenX=200,top=100,screenY=100');
</script>

60 Отображать ли панель инструментов и полосу прокрутки
Программный код справочного контента
<script Language="JavaScript">
window.open("http://www.x-force.cn/",toolbar=no, Menubar=no);
</script>

61 Можно ли масштабировать размер нового окна?
Программный код справочного контента
<script Language="JavaScript">
window.open('http://www.x-force.cn/', 'myNewWindow', 'resizable=yes' );</script>

62 Загрузить новый документ в текущее окно
Программный код справочного контента
<a href='#' onClick='document.location = '125a.html';' >Открыть новый документ</a>

63 Установите положение прокрутки страницы
Программный код справочного контента
<script Language="JavaScript">
if (document.all) { //Если это браузер IE, используйте атрибут ScrollTop
document.body.scrollTop = 200;
} else { //Если это браузер NetScape, используйте атрибут pageYOffset
окно.pageYOffset = 200;
</script>

64 Открыть полноэкранное окно в IE
Программный код справочного контента
<a href='#' onClick=”window.open('http://www.devdao.com/','newWindow','fullScreen=yes');”>Открыть полноэкранное окно</a>

65 Операции с новыми и родительскими окнами
Программный код справочного контента
<script Language="JavaScript">
//определяем новое окно
var newWindow = window.open("128a.html","newWindow");
newWindow.close(); //Закрываем новое окно, открытое в родительском окне
</script>Закройте код программы родительского окна в новом окне
window.opener.close()

66 Записать содержимое в новое окно
Программный код справочного контента
<script Language="JavaScript">
var newWindow = window.open("","newWindow");
новоеОкно.документ.открыть();
newWindow.document.write("Это новое окно");
новыйWIndow.document.close();
</script>

67 Загрузите страницу во фрейм.
Программный код справочного контента
<frameset cols="50%,*">
<frame name="frame1" src="/"135a.html"">
<frame name="frame2" src="/"about:blank"">
</frameset>
Загрузите страницу в кадре 2 в кадре 1.
родительский.frame2.document.location = «135b.html»;

Совместное использование сценариев между страницами фрейма

;

Цитирование содержимого. Если в html-файле в фрейме 1 есть код сценария
функция doAlert() {
window.alert("Кадр 1 загружен");
}

Тогда

программный код

метода

можно вызвать в кадре 2 следующим образом:

69 Данные общедоступны
Ссылочный контент может определять элементы данных на странице кадра, чтобы данные могли использоваться кодом утилиты страницы в нескольких кадрах.
<script Language="JavaScript">
var persistVariable = «Это постоянное значение»;
</скрипт>
<frameset cols="50%,*">
<frame name="frame1" src="/"138a.html"">
<frame name="frame2" src="/"138b.html"">
</frameset>

Таким образом, переменная persistVariable может использоваться как в кадре 1, так и в кадре 2.

70 Библиотека кода Framework
Цитируемое содержание Согласно некоторым из вышеизложенных идей, мы можем использовать страницу скрытого фрейма в качестве базового программного

кода

всего набора фреймов.