Пример 1. Эта функция возвращает
Пример 1. Эта функция возвращает строку, содержащую отформатированное представление чисел с заполнением ведущими нулями.
// Эта функция возвращает строку, заполненную ведущими нулями
function padZeros(num, totalLen) {
var numStr = num.toString() //инициализируется return-значение как строка
var numZeros = totalLen - numStr.length // вычисляется количество нулей
if (numZeros > 0) {
for (var i = 1; i <= numZeros; i++) {
numStr = "0" + numStr
}
}
return numStr
} Следующие операторы вызывают функцию padZeros:
result=padZeros(42,4) // возвращает "0042"
result=padZeros(42,2) // возвращает "42"
result=padZeros(5,4) // возвращает "0005"Пример 2. Вы можете определить, существует ли функция, сравнив имя функции с null. В следующем примере func1 вызывается, если функция noFunc не существует; иначе вызывается функция func2. Заметьте, что требуется имя окна при обращении к функции noFunc.
if (window.noFunc == null)
func1()
else func2() Пример 3. Здесь создаётся обработчики события onFocus и onBlur для фрэйма. Этот код находится в том же файле, который содержит тэг FRAMESET. Заметьте, штаа это единственный способ создания обработчиков onFocus и onBlur для фрэйма, поскольку Вы не можете специфицировать обработчики в тэге FRAME.
frames[0].onfocus = new Function("document.bgColor='antiquewhite'")
frames[0].onblur = new Function("document.bgColor='lightgrey'")
Пример 1. Здесь определена функция, выполняющая конкатенацию/объединение нескольких строк. Единственным формальным аргументом функции является строка, специфицирующая символ-разделитель объединяемых строк. Функция определена так:
function myConcat(separator) {
result="" // инициализация списка
// итерация по arguments
for (var i=1; i<arguments.length; i++) {
result += arguments[i] + separator
}
return result
} Вы можете передать этой функции любое количеств аргументов, и она создаст список из всех аргументов как элементов списка.
// возвращает "red, orange, blue, "
myConcat(", ","red","orange","blue")
// возвращает "elephant; giraffe; lion; cheetah;"
myConcat("; ","elephant","giraffe","lion", "cheetah") // возвращает "sage. basil. oregano. pepper. parsley. "
myConcat(". ","sage","basil","oregano", "pepper", "parsley") Пример 2. Определяется функция, создающая HTML-списки. Единственным формальным аргументом этой функции является строка, которая содержит "U", если это неупорядоченный список (bulleted), или "O", если это упорядоченный список (numbered). Функция определена так:
function list(type) {
document.write("<" + type + "L>") // начало списка
// итерация по arguments
for (var i=1; i<arguments.length; i++) {
document.write("<LI>" + arguments[i])
}
document.write("</" + type + "L>") // конец списка
} Вы можете передать этой функции любое количество аргументов, и она отобразит каждый аргумент как элемент списка указанного типа. Например, следующий вызов функции
list("U", "One", "Two", "Three")даст на выходе
<UL>
<LI>One
<LI>Two
<LI>Three
</UL>
Следующая функция возвращает значение свойства callee этой функции.
function myFunc() {
return arguments.callee
} Возвращается следующее значение:
function myFunc() { return arguments.callee; }
Следующий код проверяет значение свойства caller функции:
function myFunc() {
if (arguments.caller == null) {
return ("The function was called from the top!")
} else return ("This function's caller was " + arguments.caller)
}
Вы можете использовать call для создания цепочки конструкторов объектов, как в Java. В следующем примере конструктор объекта product определён с двумя параметрами, name и value. Другой объект, prod_dept, инициализирует свою уникальную переменную (dept) и вызывает конструктор объекта product в своём конструкторе для инициализации других переменных.
function product(name, value){
this.name = name;
if(value > 1000)
this.value = 999;
else
this.value = value;
} function prod_dept(name, value, dept){
this.dept = dept;
product.call(this, name, value);
} prod_dept.prototype = new product(); // поскольку 5 меньше 100, значение устанавливается
cheese = new prod_dept("feta", 5, "food");// поскольку 5000 больше 1000, значение будет 999
car = new prod_dept("honda", 5000, "auto");
Пример 1. Здесь форма myForm содержит объект Hidden и кнопку. Если пользователь щёлкает по кнопке, в значение объекта Hidden устанавливается имя формы. Обработчик события кнопки onClick использует this.form для обращения к родительской форме myForm.
<FORM NAME="myForm">
Form name:<INPUT TYPE="hidden" NAME="h1" VALUE="Beluga">
<P>
<INPUT NAME="button1" TYPE="button" VALUE="Store Form Name"
onClick="this.form.h1.value=this.form.name">
</FORM> Пример 2. Здесь используется ссылка на объект, а не ключевое слово this, для обращения к форме. Код возвращает ссылку на myForm, которая является контейнером для объекта myHiddenObject.
document.myForm.myHiddenObject.form
Пример 1. Здесь выполняется переход к URL , который был посещён пользователем в текущем окне на три шага назад.
history.go(-3)Пример 2. Вы можете использовать объект history со специфицированным окном или фрэймом. В данном примере window2 переходит назад на одну ступень назад в истории данного окна (или сессии):
window2.history.back() Пример 3. В этом примере второй фрэйм в наборе фрэйма переходит назад на один элемент:
parent.frames[1].history.back() Пример 4. В этом примере фрэйм frame1 набора фрэймов переходит назад на один шаг:
parent.frame1.history.back() Пример 5. В этом примере фрэйм frame2 в окне window2 переходит назад на один шаг:
window2.frame2.history.back() Пример 6. Этот код определяет, содержит ли первое вхождение массива history строку "NETSCAPE". Если это так, вызывается функция myFunction.
if (history[0].indexOf("NETSCAPE") != -1) {
myFunction(history[0])
} Пример 7. Здесь отображается весь список history:
document.writeln("<B>history is</B> " + history) Этот код отобразит примерно такое:
history is
Welcome to Netscape http://home.netscape.com/
Sun Microsystems http://www.sun.com/
Royal Airways http://www.supernet.net/~dugbrown/
Эта кнопка делает переход к ближайшему вхождению из history, которое содержит строку "home.netscape.com":
<P><INPUT TYPE="button" VALUE="Go"
onClick="history.go('home.netscape.com')"> Следующая кнопка переходит к URL, который находится на три шага назад в списке history:
<P><INPUT TYPE="button" VALUE="Go"
onClick="history.go(-3)">
Здесь определяется, содержит ли history.next строку "NETSCAPE.COM". Если да - вызывается функция myFunction.
if (history.next.indexOf("NETSCAPE.COM") != -1) {
myFunction(history.next)
}
Пример 1: Создание изображения тэгом IMG. Следующий код определяет изображение тэгом IMG:
<IMG NAME="aircraft" SRC="f15e.gif" ALIGN="left" VSPACE="10"> Следующий код обращается к изображению:
document.aircraft.src='f15e.gif' Если Вы обращаетесь к изображению по имени, Вы обязаны включать имя формы, если изображение расположено на форме. Следующий код обращается к изображению на форме:
document.myForm.aircraft.src='f15e.gif' Пример 2: Создание изображения конструктором Image. Здесь создаётся объект Image по имени myImage шириной 70 пикселов и высотой 50 пикселов. Если URL источника, seaotter.gif, не имеет размера 70x50 пикселов, он масштабируется до данного размера.
myImage = new Image(70, 50)
myImage.src = "seaotter.gif" Если Вы опускаете аргументы width и height в конструкторе Image, myImage создаётся с размерами, указанными в исходном URL..
myImage = new Image()
myImage.src = "seaotter.gif" Пример 3: Вывод изображения на основе ввода данных в форму. Здесь пользователь выбирает, какое изображение вывести. Пользователь заказывает рубашку, заполняя форму. Изображение выводится в зависимости от указанных цвета и размера рубашки. Все возможные варианты загружаются заранее, чтобы сократить время на ответ. Если пользователь щёлкает кнопку для заказа рубашки, функция allShirts выводит изображения всех рубашек.
<SCRIPT>
shirts = new Array()
shirts[0] = "R-S"
shirts[1] = "R-M"
shirts[2] = "R-L"
shirts[3] = "W-S"
shirts[4] = "W-M"
shirts[5] = "W-L"
shirts[6] = "B-S"
shirts[7] = "B-M"
shirts[8] = "B-L" doneThis = 0
shirtImg = new Array() // Предварительная загрузка изображений рубашек
for(idx=0; idx < 9; idx++) {
shirtImg[idx] = new Image()
shirtImg[idx].src = "shirt-" + shirts[idx] + ".gif"
} function changeShirt(form)
{
shirtColor = form.color.options[form.color.selectedIndex].text
shirtSize = form.size.options[form.size.selectedIndex].text newSrc = "shirt-" + shirtColor.charAt(0) + "-" + shirtSize.charAt(0) + ".gif"
document.shirt.src = newSrc
} function allShirts()
{
document.shirt.src = shirtImg[doneThis].src
doneThis++
if(doneThis != 9)setTimeout("allShirts()", 500)
else doneThis = 0 return
}</SCRIPT> <FONT SIZE=+2><B>Netscape Polo Shirts!</FONT></B> <TABLE CELLSPACING=20 BORDER=0>
<TR>
<TD><IMG name="shirt" SRC="shirt-W-L.gif"></TD> <TD>
<FORM>
<B>Color</B>
<SELECT SIZE=3 NAME="color" onChange="changeShirt(this.form)">
<OPTION> Red
<OPTION SELECTED> White
<OPTION> Blue
</SELECT> <P>
<B>Size</B>
<SELECT SIZE=3 NAME="size" onChange="changeShirt(this.form)">
<OPTION> Small
<OPTION> Medium
<OPTION SELECTED> Large
</SELECT> <P><INPUT type="button" name="buy" value="Buy This Shirt!"
onClick="allShirts()">
</FORM> </TD>
</TR>
</TABLE> Пример 4: Анимация JavaScript. В этом примере JavaScript используется для создания анимации в объекте Image путём повторяющегося изменения значения его свойства src. Скрипт начинается с предзагрузки 10 изображений, образующих эту анимацию (image1.gif, image2.gif, image3.gif и т.д.). Если объект Image размещён в документе тэгом IMG, image1.gif выводится, и обработчик onLoad начинает анимацию, вызывая функцию animate. Заметьте, что функция animate не вызывает сама себя после изменения свойства src объекта Image. Это происходит из-за того, что при изменении свойства src обработчик onLoad изображения включается и вызывается функция animate.
<SCRIPT>
delay = 100
imageNum = 1 // Предварительная загрузка изображений анимации
theImages = new Array()
for(i = 1; i < 11; i++) {
theImages[i] = new Image()
theImages[i].src = "image" + i + ".gif"
} function animate() {
document.animation.src = theImages[imageNum].src
imageNum++
if(imageNum > 10) {
imageNum = 1
}
} function slower() {
delay+=10
if(delay > 4000) delay = 4000
} function faster() {
delay-=10
if(delay < 0) delay = 0
}
</SCRIPT><BODY BGCOLOR="white"><IMG NAME="animation" SRC="image1.gif" ALT="[Animation]"
onLoad="setTimeout('animate()', delay)"> <FORM>
<INPUT TYPE="button" Value="Slower" onClick="slower()">
<INPUT TYPE="button" Value="Faster" onClick="faster()">
</FORM>
</BODY> См. также примеры для обработчиков onAbort, onError и onLoad.
