Пример
Записывается значение свойства type каждого элемента формы.
for (var i = 0; i < document.form1.elements.length; i++) {
document.writeln("<BR>type is " + document.form1.elements[i].type)
}
Пример
Следующая функция вычисляет свойство value группы радио-кнопок и выводит его в окне msgWindow:
function valueGetter() {
var msgWindow=window.open("")
for (var i = 0; i < document.valueTest.radioObj.length; i++) {
msgWindow.document.write
("The value of radioObj[" + i + "] is " +
document.valueTest.radioObj[i].value +"<BR>")
}
msgWindow.document.close()
}
Будут выведены следующие значения:
on
on
on
on
В этом примере предполагается, что кнопки были определены так:
<BR><INPUT TYPE="radio" NAME="radioObj">R&B
<BR><INPUT TYPE="radio" NAME="radioObj" CHECKED>Soul
<BR><INPUT TYPE="radio" NAME="radioObj">Rock and Roll
<BR><INPUT TYPE="radio" NAME="radioObj">Blues
Пример
Этот скрипт использует метод replace для переключения слов в строке. Для заменяющего текста скрипт использует значения свойств $1 и $2
глобального объекта RegExp. Обратите внимание, что имя объекта RegExp не предшествует свойствам $, когда они передаются как второй аргумент методу replace.
<SCRIPT LANGUAGE="JavaScript1.2">
re = /(\w+)\s(\w+)/;
str = "John Smith";
newstr=str.replace(re, "$2, $1");
document.write(newstr)
</SCRIPT>
This displays "Smith, John".
Пример
В этом примере пользователь вводит имя, и скрипт выполняет совпадения относительно ввода. Затем циклически проходит по массиву, чтобы проверить, нет ли других имён, совпадающих с именем пользователя.
В скрипте предполагается, что первые зарегистрированные имена предварительно загружаются в массив A, возможно, с получением их из базы данных party.
<HTML><SCRIPT LANGUAGE="JavaScript1.2">
A = ["Frank", "Emily", "Jane", "Harry", "Nick", "Beth", "Rick",
"Terrence", "Carol", "Ann", "Terry", "Frank", "Alice", "Rick",
"Bill", "Tom", "Fiona", "Jane", "William", "Joan", "Beth"]function lookup() {
firstName = /\w+/i();
if (!firstName)
window.alert (RegExp.input + " isn't a name!");
else {
count = 0;
for (i=0; i<A.length; i++)
if (firstName[0].toLowerCase() == A[i].toLowerCase()) count++;
if (count ==1)
midstring = " other has ";
else
midstring = " others have ";
window.alert ("Thanks, " + count + midstring + "the same name!")
}
}</SCRIPT>Enter your first name and then press Enter.<FORM> <INPUT TYPE:"TEXT" NAME="FirstName" onChange="lookup(this);"> </FORM></HTML>
Пример
Печатается сообщение, содержание которого зависит от успешности прохождения теста:
function testinput(re, str){
if (re.test(str))
midstring = " contains ";
else
midstring = " does not contain ";
document.write (str + midstring + re.source);
}
Пример
Выводится строка, отображающая строковое значение объекта RegExp:
myExp = new RegExp("a+b+c");
alert(myExp.toString())// выведет "/a+b+c/"
Пример
myExp = new RegExp("a+b+c");
alert(myExp.valueOf())выведет "/a+b+c/"
Пример
В этом примере функция valueGetter использует цикл for для итерации по массиву элементов формы valueTest. Окно msgWindow отображает имена всех элементов формы:
newWindow=window.open("http://home.netscape.com")function valueGetter() {
var msgWindow=window.open("")
for (var i = 0; i < newWindow.document.valueTest.elements.length; i++) {
msgWindow.document.write(newWindow.document.valueTest.elements[i].name + "<BR>")
}
}
Пример
Здесь записываются значения свойства type каждого элемента формы.
for (var i = 0; i < document.form1.elements.length; i++) {
document.writeln("<BR>type is " + document.form1.elements[i].type)
}
Пример
Функция создаёт строку, содержащую текущие свойства монитора:
function screen_properties() {
document.examples.results.value = "("+screen.width+" x
"+screen.height+") pixels, "+
screen.pixelDepth +" bit depth, "+
screen.colorDepth +" bit color palette depth.";
} // end function screen_properties
Пример
Здесь функция valueGetter использует цикл for для итерации по массиву элементов на форме valueTest. Окно msgWindow отображает имена всех элементов формы:
newWindow=window.open("http://home.netscape.com")function valueGetter() {
var msgWindow=window.open("")
for (var i = 0; i < newWindow.document.valueTest.elements.length; i++) {
msgWindow.document.write(newWindow.document.valueTest.elements[i].name + "<BR>")
}
}
Пример
Здесь функция getSelectedIndex возвращает индекс выбора в объекте musicType Select:
function getSelectedIndex() {
return document.musicForm.musicType.selectedIndex
}
Предполагается, что Select-объект похож на следующий:
<SELECT NAME="musicType">
<OPTION SELECTED> R&B
<OPTION> Jazz
<OPTION> Blues
<OPTION> New Age
</SELECT>
Пример
Здесь записывается значение свойства type каждого элемента формы.
for (var i = 0; i < document.form1.elements.length; i++) {
document.writeln("<BR>type is " + document.form1.elements[i].type)
}
Пример
Открывается окно msgWindow и создаётся якорь для оглавления:
var myString="Table of Contents"
msgWindow.document.writeln(myString.anchor("contents_anchor"))
Предыдущий пример даст тот же результат, что и этот HTML:
<A NAME="contents_anchor">Table of Contents</A>
Пример
Используются методы работы со строками для изменения размера текста строки:
var worldString="Hello, world"document.write(worldString.small())
document.write("<P>" + worldString.big())
document.write("<P>" + worldString.fontsize(7))
Такой же вывод даст следующий HTML:
<SMALL>Hello, world</SMALL>
<P><BIG>Hello, world</BIG>
<P><FONTSIZE=7>Hello, world</FONTSIZE>
Пример
Здесь используются методы работы со строками для изменения форматирования строки:
var worldString="Hello, world"document.write(worldString.blink())
document.write("<P>" + worldString.bold())
document.write("<P>" + worldString.italics())
document.write("<P>" + worldString.strike())
Предыдущий пример даст тот же вывод, что и следующий HTML:
<BLINK>Hello, world</BLINK>
<P><B>Hello, world</B>
<P><I>Hello, world</I>
<P><STRIKE>Hello, world</STRIKE>
Пример
Здесь используются методы работы со строками для изменения форматирования строки:
var worldString="Hello, world"
document.write(worldString.blink())
document.write("<P>" + worldString.bold())
document.write("<P>" + worldString.italics())
document.write("<P>" + worldString.strike())
Предыдущий пример даст тот же вывод, что и следующий HTML:
<BLINK>Hello, world</BLINK>
<P><B>Hello, world</B>
<P><I>Hello, world</I>
<P><STRIKE>Hello, world</STRIKE>
Пример
Отображаются символы из различных мест строки "Brave new world":
var anyString="Brave new world"document.writeln("The character at index 0 is " + anyString.charAt(0))
document.writeln("The character at index 1 is " + anyString.charAt(1))
document.writeln("The character at index 2 is " + anyString.charAt(2))
document.writeln("The character at index 3 is " + anyString.charAt(3))
document.writeln("The character at index 4 is " + anyString.charAt(4))
На выходе будет:
The character at index 0 is B
The character at index 1 is r
The character at index 2 is a
The character at index 3 is v
The character at index 4 is e
Пример
Пример 1. Этот пример возвращает 65, Unicode-значение латинской заглавной A.
"ABC".charCodeAt(0) // возвращает 65
Пример 2. Создаётся событие для симуляции нажатия клавиши. Событие KeyPress имеет свойство which, которое представляет ASCII-значение нажатой клавиши. Если Вам известна буква, число или символ, Вы можете использовать charCodeAt для предоставления ASCII-значения в свойство which.
//создаётся Еvent-объект с нужными значениями свойств
ev = new Event()
ev.type = KeyPress
ev.layerX = 150
//присваиваются значения свойствам layerY, pageX, pageY, screenX и screenY
...
//присваивается ASCII-значение свойству which
ev.which = "v".charCodeAt(0)
//assign modifier property
ev.modifiers = <FONT COLOR="#FF0080">How do I do this?</FONT>
Пример
s1="Oh "
s2="what a beautiful "
s3="mornin'."
s4=s1.concat(s2,s3) // возвращает "Oh what a beautiful mornin'."
Пример
Метод fixed используется для изменения форматирования строки:
var worldString="Hello, world"
document.write(worldString.fixed())
Предыдущий пример даст тот же вывод, что и следующий HTML:
<TT>Hello, world</TT>
Пример
Метод fontcolor используется для изменения цвета строки:
var worldString="Hello, world"document.write(worldString.fontcolor("maroon") +
" is maroon in this line")
document.write("<P>" + worldString.fontcolor("salmon") +
" is salmon in this line")
document.write("<P>" + worldString.fontcolor("red") +
" is red in this line")document.write("<P>" + worldString.fontcolor("8000") +
" is maroon in hexadecimal in this line")
document.write("<P>" + worldString.fontcolor("FA8072") +
" is salmon in hexadecimal in this line")
document.write("<P>" + worldString.fontcolor("FF00") +
" is red in hexadecimal in this line")
Предыдущий пример даст тот же вывод, что и следующий HTML:
<FONT COLOR="maroon">Hello, world</FONT> is maroon in this line
<P><FONT COLOR="salmon">Hello, world</FONT> is salmon in this line
<P><FONT COLOR="red">Hello, world</FONT> is red in this line<FONT COLOR="8000">Hello, world</FONT>
is maroon in hexadecimal in this line
<P><FONT COLOR="FA8072">Hello, world</FONT>
is salmon in hexadecimal in this line
<P><FONT COLOR="FF00">Hello, world</FONT>
is red in hexadecimal in this line
Пример
Метод string изменяет размер шрифта строки:
var worldString="Hello, world"document.write(worldString.small())
document.write("<P>" + worldString.big())
document.write("<P>" + worldString.fontsize(7))
Предыдущий пример даст тот же вывод, что и следующий HTML:
<SMALL>Hello, world</SMALL>
<P><BIG>Hello, world</BIG>
<P><FONTSIZE=7>Hello, world</FONTSIZE>
Пример
Здесь используются методы работы со строками для изменения форматирования строки:
var worldString="Hello, world"document.write(worldString.blink())
document.write("<P>" + worldString.bold())
document.write("<P>" + worldString.italics())
document.write("<P>" + worldString.strike())
Предыдущий пример даст тот же вывод, что и следующий HTML:
<BLINK>Hello, world</BLINK>
<P><B>Hello, world</B>
<P><I>Hello, world</I>
<P><STRIKE>Hello, world</STRIKE>
Пример
Здесь методы indexOf и lastIndexOf используются для локализации значений в строке "Brave new world."
var anyString="Brave new world"// Выводит 8
document.write("<P>The index of the first w from the beginning is " +
anyString.indexOf("w"))
// Выводит 10
document.write("<P>The index of the first w from the end is " +
anyString.lastIndexOf("w"))
// Выводит 6
document.write("<P>The index of 'new' from the beginning is " +
anyString.indexOf("new"))
// Выводит 6
document.write("<P>The index of 'new' from the end is " +
anyString.lastIndexOf("new"))
Пример
Будет выведена цифра 8 в диалоговом окне Alert:
var x="Netscape"
alert("The string length is " + x.length)
Пример
Слово "Netscape" выводится как гиперссылка, которая переводит пользователя на домашнюю страницу Netscape:
var hotText="Netscape"
var URL="http://home.netscape.com"document.write("Click to return to " + hotText.link(URL))
Предыдущий пример даст тот же вывод, что и следующий HTML:
Click to return to <A HREF="http://home.netscape.com">Netscape</A>
Пример
Печатается сообщение, содержание которого зависит от успешности прохождения теста.
function testinput(re, str){
if (str.search(re) != -1)
midstring = " contains ";
else
midstring = " does not contain ";
document.write (str + midstring + re.source);
}
Пример
Здесь slice используется для создания новой строки.
<SCRIPT>
str1="The morning is upon us. "
str2=str1.slice(3,-5)
document.write(str2)
</SCRIPT>
Будет напечатано:
morning is upon
Пример
Используются string-методы для изменения размера строки:
var worldString="Hello, world"document.write(worldString.small())
document.write("<P>" + worldString.big())
document.write("<P>" + worldString.fontsize(7))
Предыдущий пример даст тот же вывод, что и следующий HTML:
<SMALL>Hello, world</SMALL>
<P><BIG>Hello, world</BIG>
<P><FONTSIZE=7>Hello, world</FONTSIZE>
Пример
Здесь используются методы работы со строками для изменения форматирования строки:
var worldString="Hello, world"document.write(worldString.blink())
document.write("<P>" + worldString.bold())
document.write("<P>" + worldString.italics())
document.write("<P>" + worldString.strike())
Предыдущий пример даст тот же вывод, что и следующий HTML:
<BLINK>Hello, world</BLINK>
<P><B>Hello, world</B>
<P><I>Hello, world</I>
<P><STRIKE>Hello, world</STRIKE>
Пример
Методы sub и sup используются для форматирования строки:
var superText="superscript"
var subText="subscript"document.write("This is what a " + superText.sup() + " looks like.")
document.write("<P>This is what a " + subText.sub() + " looks like.")
Предыдущий пример даст тот же вывод, что и следующий HTML:
This is what a <SUP>superscript</SUP> looks like.
<P>This is what a <SUB>subscript</SUB> looks like.
Пример
Рассмотрим такой скрипт:
<SCRIPT LANGUAGE="JavaScript1.2">str = "abcdefghij"
document.writeln("(1,2): ", str.substr(1,2))
document.writeln("(-2,2): ", str.substr(-2,2))
document.writeln("(1): ", str.substr(1))
document.writeln("(-20, 2): ", str.substr(1,20))
document.writeln("(20, 2): ", str.substr(20,2))</SCRIPT>
Этот скрипт выведет:
(1,2): bc
(-2,2): ij
(1): bcdefghij
(-20, 2): bcdefghij
(20, 2):
Пример
Методы sub и sup использованы для форматирования строки:
var superText="superscript"
var subText="subscript"document.write("This is what a " + superText.sup() + " looks like.")
document.write("<P>This is what a " + subText.sub() + " looks like.")
Предыдущий пример даст тот же вывод, что и следующий HTML:
This is what a <SUP>superscript</SUP> looks like.
<P>This is what a <SUB>subscript</SUB> looks like.
Пример
Выводится строка "alphabet":
var upperText="ALPHABET"
document.write(upperText.toLowerCase())
Пример
Отображается строковое значение String-объекта:
x = new String("Hello world");
alert(x.toString())// Выводит "Hello world"
Пример
Выводится строка "ALPHABET":
var lowerText="alphabet"
document.write(lowerText.toUpperCase())
Пример
x = new String("Hello world");
alert(x.valueOf())// Выводит "Hello world"
Пример
Создаётся объект Submit по имени submitButton. Текст "Done" отображается на поверхности кнопки.
<INPUT TYPE="submit" NAME="submitButton" VALUE="Done">
См. примеры для Form.
Пример
В этом примере показана форма с несколькими элементами. Если пользователь щёлкает на кнопке button2, функция showElements выводит alert-диалог с именами всех элементов формы myForm.
<SCRIPT>
function showElements(theForm) {
str = "Form Elements of form " + theForm.name + ": \n "
for (i = 0; i < theForm.length; i++)
str += theForm.elements[i].name + "\n"
alert(str)
}
</SCRIPT>
<FORM NAME="myForm">
Form name:<INPUT TYPE="text" NAME="text1" VALUE="Beluga">
<P>
<INPUT NAME="button1" TYPE="button" VALUE="Show Form Name"
onClick="this.form.text1.value=this.form.name">
<INPUT NAME="button2" TYPE="submit" VALUE="Show Form Elements"
onClick="showElements(this.form)">
</FORM>
Диалог alert выведет следующий текст:
Form Elements of form myForm:
text1
button1
button2
Пример
Здесь функция valueGetter использует цикл for для итерации по массиву элементов формы valueTest. Окно msgWindow отображает имена всех элементов формы:
newWindow=window.open("http://home.netscape.com")function valueGetter() {
var msgWindow=window.open("")
for (var i = 0; i < newWindow.document.valueTest.elements.length; i++) {
msgWindow.document.write(newWindow.document.valueTest.elements[i].name + "<BR>")
}
}
Пример
Записываются значения свойства type каждого элемента формы.
for (var i = 0; i < document.form1.elements.length; i++) {
document.writeln("<BR>type is " + document.form1.elements[i].type)
}
Пример
Следующая функция вычисляет свойство value группы кнопок и выводит его в окне msgWindow:
function valueGetter() {
var msgWindow=window.open("")
msgWindow.document.write("submitButton.value is " +
document.valueTest.submitButton.value + "<BR>")
msgWindow.document.write("resetButton.value is " +
document.valueTest.resetButton.value + "<BR>")
msgWindow.document.write("helpButton.value is " +
document.valueTest.helpButton.value + "<BR>")
msgWindow.document.close()
}
Будут выведены следующие значения:
Query Submit
Reset
Help
Предполагается, что кнопки были определены так:
<INPUT TYPE="submit" NAME="submitButton">
<INPUT TYPE="reset" NAME="resetButton">
<INPUT TYPE="button" NAME="helpButton" VALUE="Help">
Пример
Убирается фокус с текстового элемента userText:
userText.blur()
Предполагается, что текстовый элемент определён так:
<INPUT TYPE="text" NAME="userText">
Пример
Функция вычисляет свойства defaultValue объекта на форме surfCity и отображает значения в окне msgWindow:
function defaultGetter() {
msgWindow=window.open("")
msgWindow.document.write("hidden.defaultValue is " +
document.surfCity.hiddenObj.defaultValue + "<BR>")
msgWindow.document.write("password.defaultValue is " +
document.surfCity.passwordObj.defaultValue + "<BR>")
msgWindow.document.write("text.defaultValue is " +
document.surfCity.textObj.defaultValue + "<BR>")
msgWindow.document.write("textarea.defaultValue is " +
document.surfCity.textareaObj.defaultValue + "<BR>")
msgWindow.document.close()
}
Пример
Здесь функция valueGetter использует цикл for для итерации по массиву элементов на форме valueTest. Окно msgWindow выводит имена всех элементов формы:
newWindow=window.open("http://home.netscape.com")function valueGetter() {
var msgWindow=window.open("")
for (var i = 0; i < newWindow.document.valueTest.elements.length; i++) {
msgWindow.document.write(newWindow.document.valueTest.elements[i].name + "<BR>")
}
}
Пример
Обработчик onClick передаёт фокус текстовому полю и выделяет весь текст :
<FORM NAME="myForm">
<B>Last name: </B><INPUT TYPE="text" NAME="lastName" SIZE=20 VALUE="Pigman">
<BR><B>First name: </B><INPUT TYPE="text" NAME="firstName" SIZE=20 VALUE="Victoria">
<BR><BR>
<INPUT TYPE="button" VALUE="Change last name"
onClick="this.form.lastName.select();this.form.lastName.focus();">
</FORM>
Пример
Записываются значения свойства type каждого элемента формы.
for (var i = 0; i < document.form1.elements.length; i++) {
document.writeln("<BR>type is " + document.form1.elements[i].type)
}
Пример
Следующая функция вычисляет свойства value группы кнопок и отображает их в окне msgWindow:
function valueGetter() {
var msgWindow=window.open("")
msgWindow.document.write("submitButton.value is " +
document.valueTest.submitButton.value + "<BR>")
msgWindow.document.write("resetButton.value is " +
document.valueTest.resetButton.value + "<BR>")
msgWindow.document.write("myText.value is " +
document.valueTest.myText.value + "<BR>")
msgWindow.document.close()
}
Пример выведет:
submitButton.value is Query Submit
resetButton.value is Reset
myText.value is Stonefish are dangerous.
Предполагается, что кнопки определены так:
<INPUT TYPE="submit" NAME="submitButton">
<INPUT TYPE="reset" NAME="resetButton">
<INPUT TYPE="text" NAME="myText" VALUE="Stonefish are dangerous.">
Пример
Убирается фокус с textarea-элемента userText:
userText.blur()
Предполагается что textarea определён так:
<TEXTAREA NAME="userText">
Initial text for the text area.
</TEXTAREA>
Пример
Следующая функция вычисляет свойство defaultValue объектов на форме surfCity и выводит эти значения в окне msgWindow:
function defaultGetter() {
msgWindow=window.open("")
msgWindow.document.write("hidden.defaultValue is " +
document.surfCity.hiddenObj.defaultValue + "<BR>")
msgWindow.document.write("password.defaultValue is " +
document.surfCity.passwordObj.defaultValue + "<BR>")
msgWindow.document.write("text.defaultValue is " +
document.surfCity.textObj.defaultValue + "<BR>")
msgWindow.document.write("textarea.defaultValue is " +
document.surfCity.textareaObj.defaultValue + "<BR>")
msgWindow.document.close()
}
Пример
Здесь функция valueGetter использует цикл for для итерации по массиву элементов на форме valueTest. Окно msgWindow выводит имена всех элементов формы:
newWindow=window.open("http://home.netscape.com")function valueGetter() {
var msgWindow=window.open("")
for (var i = 0; i < newWindow.document.valueTest.elements.length; i++) {
msgWindow.document.write(newWindow.document.valueTest.elements[i].name + "<BR>")
}
}
Пример
Здесь обработчик onClick используется для передачи фокуса полю textarea и выделения этого поля для последующего его изменения:
<FORM NAME="myForm">
<B>Last name: </B><INPUT TYPE="text" NAME="lastName" SIZE=20 VALUE="Pigman">
<BR><B>First name: </B><INPUT TYPE="text" NAME="firstName" SIZE=20 VALUE="Victoria">
<BR><B>Описание:</B>
<BR><TEXTAREA NAME="desc" ROWS=3 COLS=40>An avid scuba diver.</TEXTAREA>
<BR><BR>
<INPUT TYPE="button" VALUE="Change description"
onClick="this.form.desc.select();this.form.desc.focus();">
</FORM>
Пример
Записываются значения свойства type всех элементов формы:
for (var i = 0; i < document.form1.elements.length; i++) {
document.writeln("<BR>type is " + document.form1.elements[i].type)
}
Пример
Эта функция вычисляет свойства value группы кнопок и выводит их в окне msgWindow:
function valueGetter() {
var msgWindow=window.open("")
msgWindow.document.write("submitButton.value is " +
document.valueTest.submitButton.value + "<BR>")
msgWindow.document.write("resetButton.value is " +
document.valueTest.resetButton.value + "<BR>")
msgWindow.document.write("blurb.value is " +
document.valueTest.blurb.value + "<BR>")
msgWindow.document.close()
}
Будет выведено:
submitButton.value is Query Submit
resetButton.value is Reset
blurb.value is Tropical waters contain all sorts of cool fish,
such as the harlequin ghost pipefish, dragonet, and cuttlefish.
A cuttlefish looks much like a football wearing a tutu and a mop.
Предполагается, что кнопки были определены так:
<INPUT TYPE="submit" NAME="submitButton">
<INPUT TYPE="reset" NAME="resetButton">
<TEXTAREA NAME="blurb" rows=3 cols=60>
Tropical waters contain all sorts of cool fish,
such as the harlequin ghost pipefish, dragonet, and cuttlefish.
A cuttlefish looks much like a football wearing a tutu and a mop.
</TEXTAREA>
Пример
Функция testValue проверяет имя введённое пользователем в Text-объект формы, чтобы гарантировать, что оно имеет не более 8 символов. Этот пример использует метод alert для предупреждения пользователя.
function testValue(textElement) {
if (textElement.length > 8) {
alert("Please enter a name that is 8 characters or less")
}
}
Можно вызвать функцию testValue в обработчике onBlur объекта Text, как здесь:
Name: <INPUT TYPE="text" NAME="userName"
onBlur="testValue(userName.value)">
Пример
Кодируется и декодируется строка "Hello, world".
// кодируется строка
encodedData = btoa("Hello, world");
// строка декодируется
decodedData = atob(encodedData);
Пример
Следующие специальные кнопки выполняют ту же операцию, что и кнопка Back браузера:
<P><INPUT TYPE="button" VALUE="< Go Back"
onClick="history.back()">
<P><INPUT TYPE="button" VALUE="> Go Back"
onClick="myWindow.back()">
Пример
Метод confirm в функции confirmCleanUp используется для подтверждения закрытия приложения. Если пользователь выбрал OK, специальная функция cleanUp закрывает приложение.
function confirmCleanUp() {
if (confirm("Are you sure you want to quit this application?")) {
cleanUp()
}
}
Вы можете вызвать функцию confirmCleanUp в обработчике onClick кнопки, как показано в этом примере:
<INPUT TYPE="button" VALUE="Quit" onClick="confirmCleanUp()">
Пример
Функция возвращает строку длиной 16 байт.
function getRandom() {
return crypto.random(16)
}
Пример
Функция statusSetter устанавливает свойства status и defaultStatus в обработчике onMouseOver:
function statusSetter() {
window.defaultStatus = "Click the link for the Netscape home page"
window.status = "Netscape home page"
}<A HREF="http://home.netscape.com"
onMouseOver = "statusSetter(); return true">Netscape</A>
Заметьте, что в это примере обработчик onMouseOver возвращает true. Вы обязаны возвращать true, если хотите устанавливать defaultStatus и status в обработчиках событий.
Пример
Окно может захватывать все события Click, возникающие в его фрэймах.
<SCRIPT ARCHIVE="myArchive.jar" ID="2">
function captureClicks() {
netscape.security.PrivilegeManager.enablePrivilege(
"UniversalBrowserWrite");
enableExternalCapture();
captureEvents(Event.CLICK);
...
}
</SCRIPT>
Пример
Следующий пример создаёт окно "chromeless" (в окне chromeless отсутствуют панель утилит, полосы прокрутки, статусные области и т.д., как в диалоговом окне), пряча большую часть панелей пользовательского интерфейса:
self.menubar.visible=false;
self.toolbar.visible=false;
self.locationbar.visible=false;
self.personalbar.visible=false;
self.scrollbars.visible=false;
self.statusbar.visible=false;
Пример
Чтобы переместить текущее окно на 5 пикселов вверх (ось x) и на 10 пикселов вправо (ось у) от текущей позиции, используйте такой оператор:
self.moveBy(-5,10); // относительное позиционирование
Пример
Для перемещения текущего окна на 25 пикселов от верхней границы экрана (ось x) и на 10 пикселов от левого края экрана (ось y) используйте такой оператор:
self.moveTo(25,10); // абсолютное позиционирование
Пример
Первый оператор создаёт окно netscapeWin. Второй оператор выводит значение "netscapeHomePage" в диалоге Alert, поскольку "netscapeHomePage" является значением аргумента windowName окна netscapeWin.
netscapeWin=window.open("http://home.netscape.com","netscapeHomePage")
alert(netscapeWin.name)
Пример
Этот пример возвращает x-позицию видимой страницы.
x = myWindow.pageXOffset
Пример
Этот пример возвращает у-позицию видимой страницы.
x = myWindow.pageYOffset
Пример
Следующий пример делает окно, на которое ссылаются, "chromeless" (в chromeless-окнах нет панелей toolbars, полос прокрутки, статусной области и т.д., что делает их похожими на диалоговые окна), пряча большинство из панелей интерфейса пользователя:
self.menubar.visible=false;
self.toolbar.visible=false;
self.locationbar.visible=false;
self.personalbar.visible=false;
self.scrollbars.visible=false;
self.statusbar.visible=false;
Пример
Чтобы сделать текущее окно на 5 пикселов уже и на 10 пикселов выше, используйте такой оператор:
self.resizeBy(-5,10); // относительное позиционирование
Пример
Для прокрутки текущего окна на 5 пикселов влево и на 30 пикселов вниз от текущей позиции, используйте:
self.scrollBy(-5,30); // относительное позиционирование
Пример
В этом примере self.status используется для установки свойства status текущего окна. Такое использование устраняет неоднозначность свойства status текущего окна при вызове из формы или элемента формы с названием status внутри текущего окна.
<A HREF=""
onClick="this.href=pickRandomURL()"
onMouseOver="self.status='Pick a random URL' ; return true">
Go!</A>
Пример
Этот код отображает текущее время в объекте Text. В функции startclock вызов метода setInterval заставляет вызывать функцию showtime каждую секунду для обновления показаний часов. Заметьте, что функция startclock и метод setInterval вызываются только один раз каждый.
<SCRIPT LANGUAGE="JavaScript">
var timerID = null
var timerRunning = false
function stopclock(){
if(timerRunning)
clearInterval(timerID)
timerRunning = false
}
function startclock(){
// Убедиться, что часы остановлены
stopclock()
timerID = setInterval("showtime()",1000)
timerRunning = true
}
function showtime(){
var now = new Date()
var hours = now.getHours()
var minutes = now.getMinutes()
var seconds = now.getSeconds()
var timeValue = "" + ((hours > 12) ? hours - 12 : hours)
timeValue += ((minutes < 10) ? ":0" : ":") + minutes
timeValue += ((seconds < 10) ? ":0" : ":") + seconds
timeValue += (hours >= 12) ? " P.M." : " A.M."
document.clock.face.value = timeValue
}
</SCRIPT>
<BODY onLoad="startclock()">
<FORM NAME="clock" onSubmit="0">
<INPUT TYPE="text" NAME="face" SIZE=12 VALUE ="">
</FORM>
</BODY>
Пример
Следующий пример делает окно, на которое ссылаются, "chromeless" (в chromeless-окнах нет панели toolbar, полос прокрутки, статусной области и т.д., что делает их похожими на диалоговые окна), пряча большинство из панелей интерфейса пользователя:
self.menubar.visible=false;
self.toolbar.visible=false;
self.locationbar.visible=false;
self.personalbar.visible=false;
self.scrollbars.visible=false;
self.statusbar.visible=false;
Пример
Здесь window.status используется для установки свойства status текущего окна. Такое использование устраняет неоднозначность свойства status текущего окна при обращении к текущему окну из формы, которая называется "status", в текущем окне.
<A HREF=""
onClick="this.href=pickRandomURL()"
onMouseOver="window.status='Pick a random URL' ; return true">
Go!</A>
Примеры
Пример 1. Якорь/anchor.
В этом примере определяется anchor для текста "Welcome to JavaScript":
<A NAME="javascript_intro"><H2>Welcome to JavaScript</H2></A>
Если вышеприведённый anchor находится в файле intro.html, ссылка в другом файле может определять переход на этот anchor таким образом:
<A HREF="intro.html#javascript_intro">Introduction</A>
Пример 2. Массив anchors.
Открываются два окна. Первое окно содержит серию кнопок, которые устанавливают location.hash во втором окне на определённый anchor. Во втором окне определены 4 якоря: "0", "1", "2" и "3." (Имена якорей в документе, следовательно, 0, 1, 2, ... (document.anchors.length-1)). Когда в первом окне нажимается кнопка, обработчик события onClick проверяет существование anchor, перед тем как установить в window2.location.hash имя специфицированного якоря.
link1.html, в котором определены первое окно и кнопки, содержит следующий код:
<HTML>
<HEAD>
<TITLE>Links and Anchors: Window 1</TITLE>
</HEAD>
<BODY>
<SCRIPT> window2=open("link2.html","secondLinkWindow",
"scrollbars=yes,width=250, height=400")
function linkToWindow(num) {
if (window2.document.anchors.length > num)
window2.location.hash=num
else
alert("Anchor does not exist!")
}
</SCRIPT>
<B>Links and Anchors</B>
<FORM>
<P>Click a button to display that anchor in window #2
<P><INPUT TYPE="button" VALUE="0" NAME="link0_button"
onClick="linkToWindow(this.value)">
<INPUT TYPE="button" VALUE="1" NAME="link0_button"
onClick="linkToWindow(this.value)">
<INPUT TYPE="button" VALUE="2" NAME="link0_button"
onClick="linkToWindow(this.value)">
<INPUT TYPE="button" VALUE="3" NAME="link0_button"
onClick="linkToWindow(this.value)">
<INPUT TYPE="button" VALUE="4" NAME="link0_button"
onClick="linkToWindow(this.value)">
</FORM>
</BODY>
</HTML>
link2.html, где находятся якоря, содержит следующий код:
<HTML>
<HEAD>
<TITLE>Links and Anchors: Window 2</TITLE>
</HEAD>
<BODY>
<A NAME="0"><B>Some numbers</B> (Anchor 0)</A>
<UL><LI>one
<LI>two
<LI>three
<LI>four</UL>
<P><A NAME="1"><B>Some colors</B> (Anchor 1)</A>
<UL><LI>red
<LI>orange
<LI>yellow
<LI>green</UL>
<P><A NAME="2"><B>Some music types</B> (Anchor 2)</A>
<UL><LI>R&B
<LI>Jazz
<LI>Soul
<LI>Reggae
<LI>Rock</UL>
<P><A NAME="3"><B>Some countries</B> (Anchor 3)</A>
<UL><LI>Afghanistan
<LI>Brazil
<LI>Canada
<LI>Finland
<LI>India</UL>
</BODY>
</HTML>
Примеры
Запускается аплет с именем musicApp:
<APPLET CODE="musicSelect.class" WIDTH=200 HEIGHT=35
NAME="musicApp" MAYSCRIPT>
</APPLET>
Дополнительные примеры смотри в информации LiveConnect в книге "Клиентский JavaScript. Руководство по Использованию".
Примеры
Пример 1.
Следующий пример создаёт массив msgArray с размером 0, затем присваивает значения элементам msgArray[0] и msgArray[99], изменяя размер массива на 100.
msgArray = new Array()
msgArray[0] = "Hello"
msgArray[99] = "world"
// Следующий оператор является true,
// поскольку был определён элемент msgArray[99].
if (msgArray.length == 100)
myVar="The length is 100."
См. также примеры для onError.
Пример 2.
Двухмерный массив. Результаты присваиваются переменной myVar.
myVar="Multidimensional array test; "
a = new Array(4)
for (i=0; i < 4; i++) {
a[i] = new Array(4)
for (j=0; j < 4; j++) {
a[i][j] = "["+i+","+j+"]"
}
}
for (i=0; i < 4; i++) {
str = "Row "+i+":"
for (j=0; j < 4; j++) {
str += a[i][j]
}
myVar += str +"; "
}
Этот пример присваивает переменной myVar следующие строки (разрывы строк сделаны для лучшей читаемости):
Multidimensional array test;
Row 0:[0,0][0,1][0,2][0,3];
Row 1:[1,0][1,1][1,2][1,3];
Row 2:[2,0][2,1][2,2][2,3];
Row 3:[3,0][3,1][3,2][3,3];
Примеры
Следующий пример создаёт массив a из трёх элементов, затем объединяет их в массив три раза: используя сепаратор по умолчанию, запятую и пробел, а затем знак +.
a = new Array("Wind","Rain","Fire")
myVar1=a.join()// присваивает "Wind,Rain,Fire" переменной myVar1
myVar2=a.join(", ") // присваивает "Wind, Rain, Fire" переменной myVar1
myVar3=a.join(" + ") // присваивает "Wind + Rain + Fire" переменной myVar1
Примеры
В следующем примере функция getChoice использует свойство length для итерации по элементам массива musicType. musicType это элемент select на форме musicForm.
function getChoice() {
for (var i = 0; i < document.musicForm.musicType.length; i++) {
if (document.musicForm.musicType.options[i].selected == true) {
return document.musicForm.musicType.options[i].text
}
}
}
В следующем примере массив statesUS укорачивается до размера 50, если текущий его размер больше 50.
if (statesUS.length > 50) {
statesUS.length=50
}
Примеры
В следующем примере создаётся массив myArray из трёх элементов, затем массив разворачивается.
myArray = new Array("one", "two", "three")
myArray.reverse()
Код изменяет массив myArray таким образом:
myArray[0] становится "three"
myArray[1] становится "two"
myArray[2] становится "one"
Примеры
Следующий код выводит массив myFish до и после удаления первого элемента. Он также отображает удалённый элемент:
myFish = ["angel", "clown", "mandarin", "surgeon"];
document.writeln("myFish before: " + myFish);
shifted = myFish.shift();
document.writeln("myFish after: " + myFish);
document.writeln("Removed this element: " + shifted);
В результате получится:
myFish before: ["angel", "clown", "mandarin", "surgeon"]
myFish after: ["clown", "mandarin", "surgeon"]
Removed this element: angel
Примеры
В следующих примерах создаются Boolean-объекты с начальным значением false:
bNoParam = new Boolean()
bZero = new Boolean(0)
bNull = new Boolean(null)
bEmptyString = new Boolean("")
bfalse = new Boolean(false)
В следующих примерах создаются Boolean-объекты с начальным значением true:
btrue = new Boolean(true)
btrueString = new Boolean("true")
bfalseString = new Boolean("false")
bSuLin = new Boolean("Su Lin")
Примеры
x = new Boolean();
myVar=x.valueOf()//присвоение false to myVar
Примеры
В следующем примере создаётся кнопка с названием calcButton. Текст "Calculate" выводится на поверхности кнопки. При щелчке по кнопке вызывается функция calcFunction.
<INPUT TYPE="button" VALUE="Calculate" NAME="calcButton"
onClick="calcFunction(this.form)">
Примеры
В этом примере фокус убирается с кнопки userButton:
userButton.blur()
Здесь предполагается, что кнопка определена так:
<INPUT TYPE="button" NAME="userButton">
Примеры
Пример 1.
В следующем примере форма myForm содержит объект Text и кнопку. Когда пользователь щёлкает по кнопке, в значение объекта Text устанавливается имя формы. Обработчик onClick кнопки использует this.form для обращения к родительской форме myForm.
<FORM NAME="myForm">
Form name:<INPUT TYPE="text" NAME="text1" VALUE="Beluga">
<P>
<INPUT NAME="button1" TYPE="button" VALUE="Show Form Name"
onClick="this.form.text1.value=this.form.name">
</FORM>
Пример 2.
Здесь показана форма с несколькими элементами. Когда пользователь щёлкает button2, функция showElements отображает диалог alert, содержащий имена всех элементов формы myForm.
<script>
function showElements(theForm) {
str = "Form Elements of form " + theForm.name + ": \n "
for (i = 0; i < theForm.length; i++)
str += theForm.elements[i].name + "\n"
alert(str)
}
</script>
<FORM NAME="myForm">
Form name:<INPUT TYPE="text" NAME="text1" VALUE="Beluga">
<P>
<INPUT NAME="button1" TYPE="button" VALUE="Show Form Name"
onClick="this.form.text1.value=this.form.name">
<INPUT NAME="button2" TYPE="button" VALUE="Show Form Elements"
onClick="showElements(this.form)">
</FORM>
Диалог alert выведет следующий текст:
JavaScript Alert:
Form Elements of form myForm:
text1
button1
button2
Пример 3.
В этом примере используется ссылка на объект вместо ключевого слова this для обращения к форме. Код возвращает ссылку на myForm, которая является формой, содержащей кнопку myButton.
document.myForm.myButton.form
Примеры
В следующем примере функция valueGetter использует цикл for для итерации по массиву элементов формы valueTest. Окно msgWindow выводит имена всех элементов формы:
newWindow=window.open("http://home.netscape.com")
function valueGetter() {
var msgWindow=window.open("")
for (var i = 0; i < newWindow.document.valueTest.elements.length; i++) {
msgWindow.document.write(newWindow.document.valueTest.elements[i].name + "<BR>")
}
}
В следующем примере первый оператор создаёт окно netscapeWin. Второй оператор выводит значение "netscapeHomePage" в диалоговом окне Alert, поскольку "netscapeHomePage" является значением аргумента windowName окна netscapeWin.
netscapeWin=window.open("http://home.netscape.com","netscapeHomePage")
alert(netscapeWin.name)
Примеры
В следующем примере записывается значение свойства type каждого элемента формы.
for (var i = 0; i < document.form1.elements.length; i++) {
document.writeln("<BR>type is " + document.form1.elements[i].type)
}
Примеры
Пример 1.
Выводится группа из 4 переключателей, которые все по умолчанию отмечены:
<B>Specify your music preferences (check all that apply):</B>
<BR><INPUT TYPE="checkbox" NAME="musicpref_rnb" CHECKED> R&B
<BR><INPUT TYPE="checkbox" NAME="musicpref_jazz" CHECKED> Jazz
<BR><INPUT TYPE="checkbox" NAME="musicpref_blues" CHECKED> Blues
<BR><INPUT TYPE="checkbox" NAME="musicpref_newage" CHECKED> New Age
Пример 2.
Форма из 3 текстовых полей и одного переключателя. Можно использовать checkbox для конвертирования текста текстовых полей в верхний регистр. Каждое текстовое поле имеет обработчик onChange, который конвертирует значение поля в верхний регистр, если checkbox помечен. Переключатель имеет обработчик onClick, который конвертирует все поля в верхний регистр, если пользователь отметит переключатель.
<HTML>
<HEAD>
<TITLE>Checkbox object example</TITLE>
</HEAD>
<SCRIPT>
function convertField(field) {
if (document.form1.convertUpper.checked) {
field.value = field.value.toUpperCase()}
}
function convertAllFields() {
document.form1.lastName.value = document.form1.lastName.value.toUpperCase()
document.form1.firstName.value = document.form1.firstName.value.toUpperCase()
document.form1.cityName.value = document.form1.cityName.value.toUpperCase()
}
</SCRIPT><BODY>
<FORM NAME="form1">
<B>Last name:</B>
<INPUT TYPE="text" NAME="lastName" SIZE=20 onChange="convertField(this)">
<BR><B>First name:</B>
<INPUT TYPE="text" NAME="firstName" SIZE=20 onChange="convertField(this)">
<BR><B>City:</B>
<INPUT TYPE="text" NAME="cityName" SIZE=20 onChange="convertField(this)">
<P><INPUT TYPE="checkBox" NAME="convertUpper"
onClick="if (this.checked) {convertAllFields()}"
> Convert fields to upper case
</FORM>
</BODY>
</HTML>
Примеры
Изменяется статус переключателя newAge формы musicForm:
document.musicForm.newAge.click()
Примеры
Функция valueGetter использует цикл for для итерации по массиву элементов формы valueTest. Окно msgWindow отображает имена всех элементов формы:
newWindow=window.open("http://home.netscape.com")
function valueGetter() {
var msgWindow=window.open("")
for (var i = 0; i < newWindow.document.valueTest.elements.length; i++) {
msgWindow.document.write(newWindow.document.valueTest.elements[i].name + "<BR>")
}
}
Примеры
Значение свойства type записывается для каждого элемента формы.
for (var i = 0; i < document.form1.elements.length; i++) {
document.writeln("<BR>type is " + document.form1.elements[i].type)
}
Примеры
Вот примеры присвоения значений-дат:
today = new Date()
birthday = new Date("December 17, 1995 03:24:00")
birthday = new Date(95,11,17)
birthday = new Date(95,11,17,3,24,0)
Примеры
Пример 1.
Второй оператор присваивает значение 95 переменной year.
Xmas = new Date("December 25, 1995 23:15:00")
year = Xmas.getYear() // возвращает 95
Пример 2.
Второй оператор присваивает значение 100 переменной year.
Xmas = new Date("December 25, 2000 23:15:00")
year = Xmas.getYear() // возвращает 100
Пример 3.
Второй оператор присваивает значение -100 переменной year.
Xmas = new Date("December 25, 1800 23:15:00")
year = Xmas.getYear() // возвращает -100
Пример 4.
Второй оператор присваивает значение 95 переменной year, представляя 1995 год.
Xmas.setYear(95)
year = Xmas.getYear() // возвращает 95
Примеры
theBigDay.setHours(7)
Примеры
theBigDay = new Date("July 1, 1999")
sameAsBigDay = new Date()
sameAsBigDay.setTime(theBigDay.getTime())
Примеры
theBigDay = new Date();
theBigDay.setUTCDate(20);
Примеры
theBigDay = new Date();
theBigDay.setUTCFullYear(1997);
Примеры
theBigDay = new Date();
theBigDay.setUTCHour(8);
Примеры
theBigDay = new Date();
theBigDay.setUTCMilliseconds(500);