Создаётся прототип Tree и объект этого типа - theTree. Затем выводится свойство constructor объекта theTree.
function Tree(name) { this.name=name } theTree = new Tree("Redwood") document.writeln("<B>theTree.constructor is</B> " + theTree.constructor + "<P>")
На выходе будет:
theTree.constructor is function Tree(name) { this.name = name; }
и создаётся theDog, объект типа
Определяется тип объектов Dog и создаётся theDog, объект типа Dog:
function Dog(name,breed,color,sex) { this.name=name this.breed=breed this.color=color this.sex=sex } theDog = new Dog("Gabby","Lab","chocolate","girl")
Вызов метода toSource объекта theDog выводит исходный код JavaScript, определяющий этот объект:
theDog.toSource() //возвращает "{name:"Gabby", breed:"Lab", color:"chocolate", sex:"girl"}
Пример 1: Объект location. Печатается
Пример 1: Объект location. Печатается строковой эквивалент текущего location.
document.write("location.toString() is " + location.toString() + "<BR>")
Вывод будет таким: location.toString() is file:///C|/TEMP/myprog.html
Пример 2: Объект без строкового значения. Предположим, у Вас имеется Image-объект sealife, определённый так: <IMG NAME="sealife" SRC="images\seaotter.gif" ALIGN="left" VSPACE="10">
Поскольку сам по себе Image-объект не имеет специального метода toString, sealife.toString() возвращает: [object Image]
Пример 3: Параметр radix. Печатается строковые эквиваленты чисел от 0 до 9 в 10-ричном и двоичном формате.
for (x = 0; x < 10; x++) { document.write("Decimal: ", x.toString(10), " Binary: ", x.toString(2), "<BR>") }
Этот пример даст на выходе:
Decimal: 0 Binary: 0 Decimal: 1 Binary: 1 Decimal: 2 Binary: 10 Decimal: 3 Binary: 11 Decimal: 4 Binary: 100 Decimal: 5 Binary: 101 Decimal: 6 Binary: 110 Decimal: 7 Binary: 111 Decimal: 8 Binary: 1000 Decimal: 9 Binary: 1001
Пример 1. Здесь функция getChoice
Пример 1. Здесь функция getChoice возвращает значение свойства text для выбраной опции. Цикл for вычисляет каждую опцию Select-объекта musicType. Оператор if находит выбранную опцию.
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 } } return null }
Предполагается, что Select-объект таков:
<SELECT NAME="musicType"> <OPTION SELECTED> R&B <OPTION> Jazz <OPTION> Blues <OPTION> New Age </SELECT>
Пример 2. В следующей форме пользователь может ввести некоторый текст в первом текстовом поле, а затем ввести число от 0 до 2 (включительно) во втором текстовом поле. Когда пользователь щёлкает по кнопке, текст изменяется на номер выбранной опции, и эта опция выбирается. Код выглядит так:
<SCRIPT> function updateList(theForm, i) { theForm.userChoice.options[i].text = theForm.whatsNew.value theForm.userChoice.options[i].selected = true } </SCRIPT> <FORM> <SELECT name="userChoice"> <OPTION>Choice 1 <OPTION>Choice 2 <OPTION>Choice 3 </SELECT> <BR> New text for the option: <INPUT TYPE="text" NAME="whatsNew"> <BR> Option to change (0, 1, or 2): <INPUT TYPE="text" NAME="idx"> <BR> <INPUT TYPE="button" VALUE="Change Selection" onClick="updateList(this.form, this.form.idx.value)"> </FORM>
Функция JavaScript создаёт диалоговое окно
Функция JavaScript создаёт диалоговое окно Java:
function createWindow() { var theOwner = new Packages.java.awt.Frame(); var theWindow = new Packages.java.awt.Dialog(theOwner); theWindow.setSize(350,200); theWindow.setTitle("Hello, World"); theWindow.setVisible(true); }
Здесь функция создаёт экземпляр theWindow как Packages-объект. Методы setSize, setTitle и setVisible доступны для JavaScript как public-методы из java.awt.Dialog.
Вы можете упростить этот код,
Это код получает доступ к конструктору класса java.awt.Frame: var theOwner = new Packages.java.awt.Frame();
Вы можете упростить этот код, используя объект верхнего уровня java для доступа к конструктору: var theOwner = new java.awt.Frame();
Здесь функция valueGetter использует цикл
Здесь функция 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>") } }
Здесь функция checkPassword проверяет правильность
Здесь функция checkPassword проверяет правильность введённого пользователем пароля. Если пароль неверен, метод select выделяет поле, а метод focus возвращает ему фокус, так что пользователь может повторно ввести пароль.
function checkPassword(userPass) { if (badPassword) { alert("Please enter your password again.") userPass.focus() userPass.select() } }
Здесь предполагается, что Password-объект определён так:
<INPUT TYPE="password" NAME="userPass">
Пример 1. Пользователь может получить
Пример 1. Пользователь может получить список установленных plug-in'ов, выбрав меню About Plug-ins из Help. Чтобы увидеть код, используемый браузером для этого сообщения, выберите меню About Plug-ins из Help, затем выберите Page Source из View.
Пример 2. Следующий код присваивает укороченные переменные предопределённым свойствам LiveAudio.
var myPluginName = navigator.plugins["LiveAudio"].name var myPluginFile = navigator.plugins["LiveAudio"].filename var myPluginDesc = navigator.plugins["LiveAudio"].description
Пример 3. Этот код выводит сообщение "LiveAudio is configured for audio/wav", если LiveAudio plug-in установлен и подключён для "audio/wav" MIME-типа:
var myPlugin = navigator.plugins["LiveAudio"] var myType = myPlugin["audio/wav"] if (myType && myType.enabledPlugin == myPlugin) document.writeln("LiveAudio is configured for audio/wav")
Пример 4. Следующее выражение представляет количество MIME-типов, которые Shockwave может отобразить: navigator.plugins["Shockwave"].length
Пример 5. Этот код выводит свойства name, filename, description и length каждого Plugin-объекта на клиенте:
document.writeln("<TABLE BORDER=1><TR VALIGN=TOP>", "<TH ALIGN=left>i", "<TH ALIGN=left>name", "<TH ALIGN=left>filename", "<TH ALIGN=left>description", "<TH ALIGN=left># of types</TR>") for (i=0; i < navigator.plugins.length; i++) { document.writeln("<TR VALIGN=TOP><TD>",i, "<TD>",navigator.plugins[i].name, "<TD>",navigator.plugins[i].filename, "<TD>",navigator.plugins[i].description, "<TD>",navigator.plugins[i].length, "</TR>") } document.writeln("</TABLE>")
Этот пример даст примерно такой вывод:
Пример 1. Определяется группа радио- кнопок для выбора из трёх музыкальных каталогов. Каждая радио-кнопка имеет одно имя, NAME="musicChoice", образуя группу кнопок, в которой может быть выбрана только одна кнопка этой группы. Здесь также определено текстовое поле, которая по умолчанию имеет значение выбранной радио-кнопки, но также даёт пользователю возможность ввести нестандартное имя каталога. Обработчик onClick устанавливает в поле ввода имя каталога, если пользователь щёлкает по радио-кнопке.
<INPUT TYPE="text" NAME="catalog" SIZE="20"> <INPUT TYPE="radio" NAME="musicChoice" VALUE="soul-and-r&b" onClick="musicForm.catalog.value = 'soul-and-r&b'"> Soul and R&B <INPUT TYPE="radio" NAME="musicChoice" VALUE="jazz" onClick="musicForm.catalog.value = 'jazz'"> Jazz <INPUT TYPE="radio" NAME="musicChoice" VALUE="classical" onClick="musicForm.catalog.value = 'classical'"> Classical
Пример 2. В этом примере имеется форма с тремя текстовыми боксами и тремя радио-кнопками. Радио-кнопки позволяют выбирать регистр символов, в который конвертировать текст текстовых полей, или вообще не конвертировать этот текст. Каждое текстовое поле имеет обработчик события onChange, который изменяет значение поля в зависимости от того, какая кнопка нажата. Радио-кнопки для верхнего и нижнего регистров имеют обработчики onClick, конвертирующие все поля одновременно.
<HTML> <HEAD> <TITLE>Radio object example</TITLE> </HEAD> <SCRIPT> function convertField(field) { if (document.form1.conversion[0].checked) { field.value = field.value.toUpperCase()} else { if (document.form1.conversion[1].checked) { field.value = field.value.toLowerCase()} } } function convertAllFields(caseChange) { if (caseChange=="upper") { 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()} else { document.form1.lastName.value = document.form1.lastName.value.toLowerCase() document.form1.firstName.value = document.form1.firstName.value.toLowerCase() document.form1.cityName.value = document.form1.cityName.value.toLowerCase() } } </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><B>Convert values to:</B> <BR><INPUT TYPE="radio" NAME="conversion" VALUE="upper" onClick="if (this.checked) {convertAllFields('upper')}"> Upper case <BR><INPUT TYPE="radio" NAME="conversion" VALUE="lower" onClick="if (this.checked) {convertAllFields('lower')}"> Lower case <BR><INPUT TYPE="radio" NAME="conversion" VALUE="noChange"> No conversion </FORM> </BODY> </HTML>
См. также примеры для Link.
В этом примере переключается состояние
В этом примере переключается состояние первой радио-кнопки объекта musicType Radio на форме musicForm:
document.musicForm.musicType[0].click()
А в этом примере переключается состояние бокса-переключателя newAge checkbox на форме musicForm:
document.musicForm.newAge.click()
Пример 1. Следующий скрипт использует
Пример 1. Следующий скрипт использует метод 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>
Будет выведено "Smith, John".
Пример 2. Здесь RegExp.input устанавливается событием Change. В функции getInfo метод exec использует значение RegExp.input в качестве аргумента. Обратите внимание, что RegExp присоединён к свойствам $.
<HTML><SCRIPT LANGUAGE="JavaScript1.2"> function getInfo() { re = /(\w+)\s(\d+)/; re.exec(); window.alert(RegExp.$1 + ", your age is " + RegExp.$2); } </SCRIPT>Enter your first name and your age, and then press Enter.<FORM> <INPUT TYPE:"TEXT" NAME="NameAge" onChange="getInfo(this);"> </FORM></HTML>
объект со значением по умолчанию
Пример 1. Здесь отображается Text- объект со значением по умолчанию "CA" и кнопка reset с текстом "Clear Form" на поверхности. Если пользователь печатает аббревиатуру штата в объекте Text и щёлкает кнопку Clear Form, восстанавливается оригинальное значение "CA".
<B>State: </B><INPUT TYPE="text" NAME="state" VALUE="CA" SIZE="2"> <P><INPUT TYPE="reset" VALUE="Clear Form">
Пример 2. Здесь имеются два объекта Text, объект Select и три радио-кнопки; все эти объекты имеют значения по умолчанию. На форме имеется также кнопка reset с текстом "Defaults" на ней. Если пользователь изменяет значение любого из этих объектов и щёлкает кнопку Defaults, восстанавливаются начальные значения.
<HTML> <HEAD> <TITLE>Reset object example</TITLE> </HEAD> <BODY> <FORM NAME="form1"> <BR><B>City: </B><INPUT TYPE="text" NAME="city" VALUE="Santa Cruz" SIZE="20"> <B>State: </B><INPUT TYPE="text" NAME="state" VALUE="CA" SIZE="2"> <P><SELECT NAME="colorChoice"> <OPTION SELECTED> Blue <OPTION> Yellow <OPTION> Green <OPTION> Red </SELECT><P><INPUT TYPE="radio" NAME="musicChoice" VALUE="soul-and-r&b" CHECKED> Soul and R&B <BR><INPUT TYPE="radio" NAME="musicChoice" VALUE="jazz"> Jazz <BR><INPUT TYPE="radio" NAME="musicChoice" VALUE="classical"> Classical <P><INPUT TYPE="reset" VALUE="Defaults" NAME="reset1"> </FORM> </BODY> </HTML>
Здесь убирается фокус
Здесь убирается фокус с reset-кнопки userReset:
userReset.blur()Предполагается, что кнопка определена так:
<INPUT TYPE="reset" NAME="userReset">
Эта функция вычисляет свойство value
Эта функция вычисляет свойство 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">
Пример 1. Отображаются два списка
Пример 1. Отображаются два списка selection. В первом списке пользователь может выбрать только один элемент; во втором списке можно выбрать несколько элементов.
Choose the music type for your free CD: <SELECT NAME="music_type_single"> <OPTION SELECTED> R&B <OPTION> Jazz <OPTION> Blues <OPTION> New Age </SELECT> <P>Choose the music types for your free CDs: <BR><SELECT NAME="music_type_multi" MULTIPLE> <OPTION SELECTED> R&B <OPTION> Jazz <OPTION> Blues <OPTION> New Age </SELECT>
Пример 2. Отображаются два списка selection, которые позволяют выбрать месяц и число. Эти списки selection инициализируются текущей датой. Пользователь может изменить месяц и число, используя списки selection или выбрав предустановленные даты радио-кнопками. Текстовые поля на форме отображают значения свойств объектов Select и указывают выбранную дату и то, является ли эта дата Cinco de Mayo.
<HTML> <HEAD> <TITLE>Select object example</TITLE> </HEAD> <BODY> <SCRIPT> var today = new Date() //--------------- function updatePropertyDisplay(monthObj,dayObj) { // Get date strings var monthInteger, dayInteger, monthString, dayString monthInteger=monthObj.selectedIndex dayInteger=dayObj.selectedIndex monthString=monthObj.options[monthInteger].text dayString=dayObj.options[dayInteger].text // Display property values document.selectForm.textFullDate.value=monthString + " " + dayString document.selectForm.textMonthLength.value=monthObj.length document.selectForm.textDayLength.value=dayObj.length document.selectForm.textMonthName.value=monthObj.name document.selectForm.textDayName.value=dayObj.name document.selectForm.textMonthIndex.value=monthObj.selectedIndex document.selectForm.textDayIndex.value=dayObj.selectedIndex // Is it Cinco de Mayo? if (monthObj.options[4].selected && dayObj.options[4].selected) document.selectForm.textCinco.value="Yes!" else document.selectForm.textCinco.value="No" } </SCRIPT> <!---------------> <FORM NAME="selectForm"> <P><B>Choose a month and day:</B> Month: <SELECT NAME="monthSelection" onChange="updatePropertyDisplay(this,document.selectForm.daySelection)"> <OPTION> January <OPTION> February <OPTION> March <OPTION> April <OPTION> May <OPTION> June <OPTION> July <OPTION> August <OPTION> September <OPTION> October <OPTION> November <OPTION> December </SELECT> Day: <SELECT NAME="daySelection" onChange="updatePropertyDisplay(document.selectForm.monthSelection,this)"> <OPTION> 1 <OPTION> 2 <OPTION> 3 <OPTION> 4 <OPTION> 5 <OPTION> 6 <OPTION> 7 <OPTION> 8 <OPTION> 9 <OPTION> 10 <OPTION> 11 <OPTION> 12 <OPTION> 13 <OPTION> 14 <OPTION> 15 <OPTION> 16 <OPTION> 17 <OPTION> 18 <OPTION> 19 <OPTION> 20 <OPTION> 21 <OPTION> 22 <OPTION> 23 <OPTION> 24 <OPTION> 25 <OPTION> 26 <OPTION> 27 <OPTION> 28 <OPTION> 29 <OPTION> 30 <OPTION> 31 </SELECT> <P><B>Set the date to: </B> <INPUT TYPE="radio" NAME="dateChoice" onClick=" monthSelection.selectedIndex=0; daySelection.selectedIndex=0; updatePropertyDisplay document.selectForm.monthSelection,document.selectForm.daySelection)"> New Year's Day <INPUT TYPE="radio" NAME="dateChoice" onClick=" monthSelection.selectedIndex=4; daySelection.selectedIndex=4; updatePropertyDisplay (document.selectForm.monthSelection,document.selectForm.daySelection)"> Cinco de Mayo <INPUT TYPE="radio" NAME="dateChoice" onClick=" monthSelection.selectedIndex=5; daySelection.selectedIndex=20; updatePropertyDisplay (document.selectForm.monthSelection,document.selectForm.daySelection)"> Summer Solstice <P><B>Property values:</B> <BR>Date chosen: <INPUT TYPE="text" NAME="textFullDate" VALUE="" SIZE=20"> <BR>monthSelection.length<INPUT TYPE="text" NAME="textMonthLength" VALUE="" SIZE=20"> <BR>daySelection.length<INPUT TYPE="text" NAME="textDayLength" VALUE="" SIZE=20"> <BR>monthSelection.name<INPUT TYPE="text" NAME="textMonthName" VALUE="" SIZE=20"> <BR>daySelection.name<INPUT TYPE="text" NAME="textDayName" VALUE="" SIZE=20"> <BR>monthSelection.selectedIndex <INPUT TYPE="text" NAME="textMonthIndex" VALUE="" SIZE=20"> <BR>daySelection.selectedIndex<INPUT TYPE="text" NAME="textDayIndex" VALUE="" SIZE=20"> <BR>Is it Cinco de Mayo? <INPUT TYPE="text" NAME="textCinco" VALUE="" SIZE=20"> <SCRIPT> document.selectForm.monthSelection.selectedIndex=today.getMonth() document.selectForm.daySelection.selectedIndex=today.getDate()-1 updatePropertyDisplay(document.selectForm.monthSelection,document.selectForm.daySelection) </SCRIPT> </FORM> </BODY> </HTML>
Пример 3. Добавление опции конструктором Option. В этом примере создаются два объекта Select, один с и другой без атрибута MULTIPLE. Сначала опции ни для одного из объектов не определены. Если пользователь щёлкает кнопку, ассоциированную с объектом Select, функция populate создаёт четыре опции для Select-объекта и выбирает первую опцию.
<SCRIPT> function populate(inForm) { colorArray = new Array("Red", "Blue", "Yellow", "Green") var option0 = new Option("Red", "color_red") var option1 = new Option("Blue", "color_blue") var option2 = new Option("Yellow", "color_yellow") var option3 = new Option("Green", "color_green") for (var i=0; i < 4; i++) { eval("inForm.selectTest.options[i]=option" + i) if (i==0) { inForm.selectTest.options[i].selected=true } } history.go(0) } </SCRIPT> <H3>Select Option() constructor</H3> <FORM> <SELECT NAME="selectTest"></SELECT><P> <INPUT TYPE="button" VALUE="Populate Select List" onClick="populate(this.form)"> <P> </FORM><HR> <H3>Select-Multiple Option() constructor</H3> <FORM> <SELECT NAME="selectTest" multiple></SELECT><P> <INPUT TYPE="button" VALUE="Populate Select List" onClick="populate(this.form)"> </FORM>
Пример 4. Удаление опции. Следующая функция удаляет опцию из Select-объекта.
function deleteAnItem(theList,itemNo) { theList.options[itemNo]=null history.go(0) }
Пример 1: Строковой литерал. Создаётся
Пример 1: Строковой литерал. Создаётся строковой литерал:
var last_name = "Schaefer"
Пример 2: Свойства строкового литерала. Следующие операторы вычисляются в 8, "SCHAEFER" и "schaefer":
last_name.length last_name.toUpperCase() last_name.toLowerCase()
Пример 3: Доступ к определённым символам строки. Вы можете представить строку как массив символов. Тогда можно получить доступ к отдельным символам строки по индексу этого массива.
var myString = "Hello" myString[0] // возвращает "H"
Пример 4: Передача строки между скриптами в различных окнах и фрэймах. Следующий код создаёт две строковые переменные и открывает второе окно:
var lastName = "Schaefer" var firstName = "Jesse" empWindow=window.open('string2.html','window1','width=300,height=300')
Если код HTML второго окна (string2.html) создаёт две строковые переменные empLastName и empFirstName, следующий код в первом окне присваивает значения переменным второго окна:
empWindow.empFirstName=firstName empWindow.empLastName=lastName
А этот код в первом окне выводит значения переменных второго окна:
alert('empFirstName in empWindow is ' + empWindow.empFirstName) alert('empLastName in empWindow is ' + empWindow.empLastName)
Пример 1. Этот пример возвращает
Пример 1. Этот пример возвращает строку "ABC".
String.fromCharCode(65,66,67)
Пример 2. Свойство which событий KeyDown, KeyPress и KeyUp содержит ASCII-значение клавиши клавиатуры, нажатой при возникновении события. Если Вы хотите получить фактическую букву, число или символ клавиши, Вы можете использовать fromCharCode. Следующий пример возвращает букву, число или символ в свойстве which события KeyPress.
String.fromCharCode(KeyPress.which)
и lastIndexOf используются для локализации
Пример 1. Методы 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"))
Пример 2. В этом примере определены две строковые переменные. Они содержат одинаковые строки, но вторая строка содержит символы в верхнем регистре. Первый метод writeln выводит 19. Поскольку метод indexOf учитывает регистр символов, строка "cheddar" не найдена в строке myCapString, поэтому второй метод writeln выведет -1.
myString="brie, pepper jack, cheddar" myCapString="Brie, Pepper Jack, Cheddar" document.writeln('myString.indexOf("cheddar") is ' + myString.indexOf("cheddar")) document.writeln('<P>myCapString.indexOf("cheddar") is ' + myCapString.indexOf("cheddar"))
Пример 3. Здесь в count устанавливается количество вхождений буквы x в строке str:
count = 0; pos = str.indexOf("x"); while ( pos != -1 ) { count++; pos = str.indexOf("x",pos+1); }
Пример 1. Здесь match используется
Пример 1. Здесь match используется для поиска подстроки 'Chapter' с последующим одним или более цифровыми символами, с последующей десятичной точкой и цифровыми символами 0 или более раз. Регулярно выражение включает флаг i, поэтому регистр символов игнорируется.
<SCRIPT> str = "For more information, see Chapter 3.4.5.1"; re = /(chapter \d+(\.\d)*)/i; found = str.match(re); document.write(found); </SCRIPT>
Возвращает массив, содержащий Chapter 3.4.5.1,Chapter 3.4.5.1,.1
'Chapter 3.4.5.1' это первое совпадение и первое значение, запомненное из (Chapter \d+(\.\d)*).
'.1' это второе значение, запомненное из (\.\d).
Пример 2. Здесь демонстрируется использование флагов global и ignore case вместе с match.
<SCRIPT> str = "abcDdcba"; newArray = str.match(/d/gi); document.write(newArray); </SCRIPT>
Возвращаемые массив содержит D, d.
Пример 1. Здесь регулярное выражение
Пример 1. Здесь регулярное выражение содержит флаги global и ignore case с разрешением методу replace замещать каждое вхождение 'apples' на 'oranges'.
<SCRIPT> re = /apples/gi; str = "Apples are round, and apples are juicy."; newstr=str.replace(re, "oranges"); document.write(newstr) </SCRIPT>
Будет напечатано "oranges are round, and oranges are juicy."
Пример 2. В этом примере регулярное выражение определено в методе replace и содержит флаг игнорирования регистра.
<SCRIPT> str = "Twas the night before Xmas..."; newstr=str.replace(/xmas/i, "Christmas"); document.write(newstr) </SCRIPT>
Будет напечатано "Twas the night before Christmas..."
Пример 3. Этот скрипт переключает слова в строке. Для замещающего текста используются значения свойств $1 и $2.
<SCRIPT LANGUAGE="JavaScript1.2"> re = /(\w+)\s(\w+)/; str = "John Smith"; newstr = str.replace(re, "$2, $1"); document.write(newstr) </SCRIPT>
Будет напечатано "Smith, John".
Пример 4. Здесь градусы по Фаренгейту замещаются эквивалентом по Цельсию. Градусы по Фаренгейту должны быть числом с конечной F. Функция возвращает число по Цельсию с конечной С. Например, если введено 212F, функция возвращает 100C. Если введено 0F, функция возвращает -17.77777777777778C.
Регулярное выражение test проверяет числа с конечной буквой F. Число по Фаренгейту доступно для Вашей функции через параметр $1. Функция устанавливает число по Цельсию на основе значения по Фаренгейту, передаваемого в строке функции f2c. Затем f2c возвращает число по Цельсию. Эта функция напоминает флаг s///e из Perl.
function f2c(x) { var s = String(x) var test = /(\d+(\.\d*)?)F\b/g return s.replace (test, myfunction ($0,$1,$2) { return (($1-32) * 5/9) + "C"; } ) }
Пример 1. определена функция, которая
Пример 1. определена функция, которая разделяет строку на массив строк с использованием специфицированного сепаратора. После разделения строки, функция выводит сообщения, указывающие строку-оригинал (до разделения), используемый сепаратор, количество элементов массива и отдельные элементы массива.
function splitString (stringToSplit,separator) { arrayOfStrings = stringToSplit.split(separator) document.write ('<P>The original string is: "' + stringToSplit + '"') document.write ('<BR>The separator is: "' + separator + '"') document.write ("<BR>The array has " + arrayOfStrings.length + " elements: ") for (var i=0; i < arrayOfStrings.length; i++) { document.write (arrayOfStrings[i] + " / ") } }var tempestString="Oh brave new world that has such people in it." var monthString="Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec"var space=" " var comma=","splitString(tempestString,space) splitString(tempestString) splitString(monthString,comma)
Этот пример даст на выходе:
The original string is: "Oh brave new world that has such people in it." The separator is: " " The array has 10 elements: Oh / brave / new / world / that / has / such / people / in / it. /The original string is: "Oh brave new world that has such people in it." The separator is: "undefined" The array has 1 elements: Oh brave new world that has such people in it. /The original string is: "Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec" The separator is: "," The array has 12 elements: Jan / Feb / Mar / Apr / May / Jun / Jul / Aug / Sep / Oct / Nov / Dec /
Пример 2. Рассмотрим следующий скрипт:
<SCRIPT LANGUAGE="JavaScript1.2"> str="She sells seashells \nby the\n seashore" document.write(str + "<BR>") a=str.split(" ") document.write(a) </SCRIPT>
С использованием LANGUAGE="JavaScript1.2" это скрипт даст:
"She", "sells", "seashells", "by", "the", "seashore"
Без LANGUAGE="JavaScript1.2" этот скрипт разделит только по одиночным пробельным символам:
"She", "sells", , , , "seashells", "by", , , "the", "seashore"
Пример 3. В этом примере split ищет 0 или более пробелов, с последующим символом ; и с последующими 0 или более пробелов и, если это найдено, удаляет пробелы из строки.
nameList это массив, возвращаемый как результат работы split.
<SCRIPT> names = "Harry Trump ;Fred Barney; Helen Rigby ; Bill Abel ;Chris Hand "; document.write (names + "<BR>" + "<BR>"); re = /\s*;\s*/; nameList = names.split (re); document.write(nameList); </SCRIPT>
Будут напечатаны две строки; первая - строка-оригинал, вторая - результирующий массив. Harry Trump ;Fred Barney; Helen Rigby ; Bill Abel ;Chris Hand Harry Trump,Fred Barney,Helen Rigby,Bill Abel,Chris Hand Пример 4. Здесь split ищет 0 или более пробелов в строке и возвращает первые три найденные разделения .
<SCRIPT LANGUAGE="JavaScript1.2"> myVar = " Hello World. How are you doing? "; splits = myVar.split(" ", 3); document.write(splits) </SCRIPT>
Скрипт выведет: ["Hello", "World.", "How"]
Пример 1. Здесь substring используется
Пример 1. Здесь substring используется для отображения символов их строки "Netscape":
var anyString="Netscape"// Выводит "Net" document.write(anyString.substring(0,3)) document.write(anyString.substring(3,0)) // Выводит "cap" document.write(anyString.substring(4,7)) document.write(anyString.substring(7,4)) // Выводит "Netscap" document.write(anyString.substring(0,7)) // Выводит "Netscape" document.write(anyString.substring(0,8)) document.write(anyString.substring(0,10))
Пример 2. Заменяется подстрока в строке. Заменяются отдельные символы и подстроки. Вызов функции в конце примера изменяет строку "Brave New World" на "Brave New Web".
function replaceString(oldS,newS,fullS) { // заменяет oldS на newS в строке fullS for (var i=0; i<fullS.length; i++) { if (fullS.substring(i,i+oldS.length) == oldS) { fullS = fullS.substring(0,i)+newS+fullS.substring(i+oldS.length,fullS.length) } } return fullS }replaceString("World","Web","Brave New World")
Пример 3. В JavaScript 1.2, используя LANGUAGE="JavaScript1.2", следующий скрипт выдаёт ошибку времени выполнения (out of memory).
<SCRIPT LANGUAGE="JavaScript1.2"> str="Netscape" document.write(str.substring(0,3); document.write(str.substring(3,0); </SCRIPT>
Без LANGUAGE="JavaScript1.2" вышеприведённый скрипт напечатает следующее: Net Net Во втором write числа-индексы меняются местами.
объект длиной 25 символов. Текстовое
Пример 1. Создаётся Text- объект длиной 25 символов. Текстовое поле расположено сразу справа от слов "Last name:". При загрузке формы текстовое поле очищено.
<B>Last name:</B> <INPUT TYPE="text" NAME="last_name" VALUE="" SIZE=25>
Пример 2. Создаются два Text-объекта на форме. Каждый объект имеет значение по умолчанию. Объект city имеет обработчик onFocus, который выделяет весь текст в поле, когда пользователь переходит в это поле с помощью табуляции. Объект state имеет обработчик onChange, который переводит значение в верхний регистр.
<FORM NAME="form1"> <BR><B>City: </B><INPUT TYPE="text" NAME="city" VALUE="Anchorage" SIZE="20" onFocus="this.select()"> <B>State: </B><INPUT TYPE="text" NAME="state" VALUE="AK" SIZE="2" onChange="this.value=this.value.toUpperCase()"> </FORM>
См. также примеры для onBlur, onChange, onFocus и onSelect.
Пример 1. Форма myForm содержит
Пример 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.
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, которая является формой, содержащей элемент myTextObject.
document.myForm.myTextObject.form
Пример 1. Создаётся объект Textarea
Пример 1. Создаётся объект Textarea размером 6 рядов на 55 столбцов. Поле textarea расположено ниже слова "Description:". Когда форма загружается, Textarea-объект содержит несколько строк данных, включая одну пустую строку.
<B>Description:</B> <BR><TEXTAREA NAME="item_description" ROWS=6 COLS=55> Our storage ottoman provides an attractive way to store lots of CDs and videos--and it's versatile enough to store other things as well.It can hold up to 72 CDs under the lid and 20 videos in the drawer below. </TEXTAREA>
Пример 2. Сроковая переменная содержит символы новой строки для различных платформ. Если пользователь щёлкает кнопку, Textarea-объект заполняется значением из строковой переменной. В результате получаются три строки текста в Textarea-объекте.
<SCRIPT> myString="This is line one.\nThis is line two.\rThis is line three." </SCRIPT> <FORM NAME="form1"> <INPUT TYPE="button" Value="Populate the textarea" onClick="document.form1.textarea1.value=myString"> <P> <TEXTAREA NAME="textarea1" ROWS=6 COLS=55></TEXTAREA>
Пример 1. Здесь показана форма
Пример 1. Здесь показана форма с несколькими элементами. Если пользователь щёлкает кнопку button2, функция showElements отображает диалог alert с именами всех элементов формы myForm.
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="textarea" 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
Пример 2. Здесь используется ссылка объекта, а не ключевое слово this, для ссылки на форму. Код возвращает ссылку на myForm, которая является формой - контейнером объекта myTextareaObject.
document.myForm.myTextareaObject.form
Пример 1. Окна, открывающие другие
Пример 1. Окна, открывающие другие окна. Здесь документ верхнего окна открывает второе окно window2 и определяет push-кнопки, которые открывают окно с сообщением, записывает в окно сообщения, закрывает его и закрывает window2. Обработчики onLoad и onUnload документа, загруженного в window2, выводят предупреждающие сообщения при открытии и закрытии окна.
win1.html, который определяет фрэймы для первого окна, содержит следующий код:
<HTML> <HEAD> <TITLE>window object example: Window 1</TITLE> </HEAD> <BODY BGCOLOR="antiquewhite"> <SCRIPT> window2=open("win2.html","secondWindow", "scrollbars=yes,width=250, height=400") document.writeln("<B>The first window has no name: " + window.name + "</B>") document.writeln("<BR><B>The second window is named: " + window2.name + "</B>") </SCRIPT> <FORM NAME="form1"> <P><INPUT TYPE="button" VALUE="Open a message window" onClick = "window3=window.open('','messageWindow', 'scrollbars=yes,width=175, height=300')"> <P><INPUT TYPE="button" VALUE="Write to the message window" onClick="window3.document.writeln('Hey there'); window3.document.close()"> <P><INPUT TYPE="button" VALUE="Close the message window" onClick="window3.close()"> <P><INPUT TYPE="button" VALUE="Close window2" onClick="window2.close()"> </FORM> </BODY> </HTML>
win2.html, который определяет содержимое окна window2, содержит следующий код:
<HTML> <HEAD> <TITLE>window object example: Window 2</TITLE> </HEAD> <BODY BGCOLOR="oldlace" onLoad="alert('Message from ' + window.name + ': Hello, World.')" onUnload="alert('Message from ' + window.name + ': I\'m closing')"> <B>Some numbers</B> <UL><LI>one <LI>two <LI>three <LI>four</UL> </BODY> </HTML>
Пример 2. Создание фрэймов. Создаются два окна, каждое из 4 фрэймов. В первом окне первый фрэйм содержит кнопки, которые изменяют цвет фона фрэймов в обоих окнах.
framset1.html, где определяются фрэймы первого окна, содержит следующий код:
<HTML> <HEAD> <TITLE>Frames and Framesets: Window 1</TITLE> </HEAD> <FRAMESET ROWS="50%,50%" COLS="40%,60%" onLoad="alert('Hello, World.')"> <FRAME SRC=framcon1.html NAME="frame1"> <FRAME SRC=framcon2.html NAME="frame2"> <FRAME SRC=framcon2.html NAME="frame3"> <FRAME SRC=framcon2.html NAME="frame4"> </FRAMESET> </HTML>
framset2.html, где определяются фрэймы второго окна, содержит следующий код:
<HTML> <HEAD> <TITLE>Frames and Framesets: Window 2</TITLE> </HEAD> <FRAMESET ROWS="50%,50%" COLS="40%,60%"> <FRAME SRC=framcon2.html NAME="frame1"> <FRAME SRC=framcon2.html NAME="frame2"> <FRAME SRC=framcon2.html NAME="frame3"> <FRAME SRC=framcon2.html NAME="frame4"> </FRAMESET> </HTML>
framcon1.html, где определяется содержимое первого фрэйма первого окна, содержит следующий код:
<HTML> <BODY> <A NAME="frame1"><H1>Frame1</H1></A> <P><A HREF="framcon3.htm" target=frame2>Click here</A> to load a different file into frame 2. <SCRIPT> window2=open("framset2.htm","secondFrameset") </SCRIPT> <FORM> <P><INPUT TYPE="button" VALUE="Change frame2 to teal" onClick="parent.frame2.document.bgColor='teal'"> <P><INPUT TYPE="button" VALUE="Change frame3 to slateblue" onClick="parent.frames[2].document.bgColor='slateblue'"> <P><INPUT TYPE="button" VALUE="Change frame4 to darkturquoise" onClick="top.frames[3].document.bgColor='darkturquoise'"><P><INPUT TYPE="button" VALUE="window2.frame2 to violet" onClick="window2.frame2.document.bgColor='violet'"> <P><INPUT TYPE="button" VALUE="window2.frame3 to fuchsia" onClick="window2.frames[2].document.bgColor='fuchsia'"> <P><INPUT TYPE="button" VALUE="window2.frame4 to deeppink" onClick="window2.frames[3].document.bgColor='deeppink'"> </FORM> </BODY> </HTML>
framcon2.html, где определяется содержимое остальных фрэймов, содержит следующий код:
<HTML> <BODY> <P>This is a frame. </BODY> </HTML>
framcon3.html, на который ссылается объект Link в framcon1.html, содержит следующий код:
<HTML> <BODY> <P>This is a frame. What do you think? </BODY> </HTML>
Пример 1. Любая из следующих
Пример 1. Любая из следующих строк закрывает текущее окно:
window.close() self.close() close()
Пример 2: Закрытие главного окна браузера.
top.opener.close()
Пример 3. Здесь закрывается окно messageWin:
messageWin.close()
Предполагается, что окно было открыто примерно в такой манере:
messageWin=window.open("")
Пример 1. Следующий код открывает
Пример 1. Следующий код открывает окно win1, затем позже проверяет, было ли оно закрыто. Вызываемая функция зависит от того, закрыто ли окно win1.
win1=window.open('opener1.html','window1','width=300,height=300') ... if (win1.closed) function1() else function2()
Пример 2. Определяется, закрыто ли окно, открывшее текущее окно, и вызывается соответствующая функция.
if (window.opener.closed) function1() else function2()
Функция checkPassword подтверждает, что пользователь
Функция checkPassword подтверждает, что пользователь ввёл верный пароль. Если введён неправильный пароль, метод focus возвращает фокус объекту Password, а метод select выделяет его, чтобы пользователь мог повторно ввести пароль.
function checkPassword(userPass) { if (badPassword) { alert("Please enter your password again.") userPass.focus() userPass.select() } }
Предполагается, что объект Password определён так:
<INPUT TYPE="password" NAME="userPass">
Следующая кнопка выполняет то же
Следующая кнопка выполняет то же действие, что и кнопка Forward браузера:
<P><INPUT TYPE="button" VALUE="< Go Forth" onClick="history.forward()"> <P><INPUT TYPE="button" VALUE="> Go Forth" onClick="myWindow.forward()">
в окне chromeless отсутствуют панель
Следующий пример создаёт окно "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;
Пример 1. Функция windowOpener открывает
Пример 1. Функция windowOpener открывает окно и использует методы write для вывода сообщения:
function windowOpener() { msgWindow=window.open("","displayWindow","menubar=yes") msgWindow.document.write ("<HEAD><TITLE>Message window</TITLE></HEAD>") msgWindow.document.write ("<CENTER><BIG><B>Hello, world!</B></BIG></CENTER>") }
Пример 2. Это обработчик onClick, который открывает новое клиентское окно, выводя содержимое, специфицированное в файле sesame.html. Окно открывается со специфицированными установками опций; все другие опции будут false, поскольку не специфицированы.
<FORM NAME="myform"> <INPUT TYPE="button" NAME="Button1" VALUE="Open Sesame!" onClick="window.open ('sesame.html', 'newWin', 'scrollbars=yes,status=yes,width=300,height=300')"> </FORM>
Этот код закрывает окно, которое
Пример 1: Закрытие opener'а. Этот код закрывает окно, которое открыло текущее окно. Если opener-окно закрывается, opener остаётся без изменений. Однако window.opener.name вычисляется теперь в undefined.
window.opener.close()
Пример 2: Закрытие главного окна браузера.
top.opener.close()
Пример 3: Вычисление имени opener'а. Окно может определить имя своего opener'а так:
document.write("<BR>opener property is " + window.opener.name)
Пример 4: Изменение значения opener. Этот код изменяет значение свойства opener в null. После выполнения этого кода вы не сможете закрыть opener-окно так, как это делается в Примере 1.
window.opener=null
Пример 5: Изменение значения свойства через opener. Изменяется цвет фона окна, специфицированного свойством opener.
window.opener.document.bgColor='bisque'
Чтобы сделать окно шириной 225
Чтобы сделать окно шириной 225 пикселов и высотой 200 пикселов, используйте этот оператор:
self.resizeTo(225,200); // абсолютное позиционирование
Следующий пример делает окно, на
Следующий пример делает окно, на которое ссылаются, "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;
Пример 1: Прокрутка текущей области
Пример 1: Прокрутка текущей области просмотра. Для прокрутки окна к левой границе и на 20 пикселов вниз от верха окна, используйте этот оператор:
self.scrollTo(0,20); // абсолютное позиционирование
Пример 2: Прокрутка другой области просмотра. Это код, расположенный в одном фрэйме, прокручивает область просмотра другого фрэйма. Два объекта Text дают пользователю возможность специфицировать координаты x и y. если пользователь щёлкает по кнопке Go, документ в frame2 прокручивается на специфицированные координаты.
<SCRIPT> function scrollIt(form) { var x = parseInt(form.x.value) var y = parseInt(form.y.value) parent.frame2.scrollTo(x, y) } </SCRIPT> <BODY><FORM NAME="myForm"> <P><B>Specify the coordinates to scroll to:</B> <BR>Horizontal: <INPUT TYPE="text" NAME=x VALUE="0" SIZE=4> <BR>Vertical: <INPUT TYPE="text" NAME=y VALUE="0" SIZE=4> <BR><INPUT TYPE="button" VALUE="Go" onClick="scrollIt(document.myForm)"> </FORM>
Пример 1. Сообщение alert выводится
Пример 1. Сообщение alert выводится через 5 секунд (5,000 миллисекунд) после щелчка пользователя по кнопке. Если пользователь щёлкает вторую кнопку до вывода сообщения, таймаут отменяется и alert не отображается.
<SCRIPT LANGUAGE="JavaScript"> function displayAlert() { alert("5 seconds have elapsed since the button was clicked.") } </SCRIPT> <BODY> <FORM> Click the button on the left for a reminder in 5 seconds; click the button on the right to cancel the reminder before it is displayed. <P> <INPUT TYPE="button" VALUE="5-second reminder" NAME="remind_button" onClick="timerID=setTimeout('displayAlert()',5000)"> <INPUT TYPE="button" VALUE="Clear the 5-second reminder" NAME="remind_disable_button" onClick="clearTimeout(timerID)"> </FORM> </BODY>
Пример 2. Выводится текущее время в объекте Text. Функция showtime, вызываемая рекурсивно, использует метод setTimeout для обновления значения каждую секунду.
<HEAD> <SCRIPT LANGUAGE="JavaScript"> <!-- var timerID = null var timerRunning = false function stopclock(){ if(timerRunning) clearTimeout(timerID) timerRunning = false } function startclock(){ // Убедиться, что часы остановлены stopclock() showtime() }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 timerID = setTimeout("showtime()",1000) timerRunning = true } //--> </SCRIPT> </HEAD><BODY onLoad="startclock()"> <FORM NAME="clock" onSubmit="0"> <INPUT TYPE="text" NAME="face" SIZE=12 VALUE =""> </FORM> </BODY>
Вы создали функцию JavaScript под
Предположим, Вы создали функцию JavaScript под названием pickRandomURL, которая даёт возможность выбрать произвольный URL. Вы можете использовать обработчик onClick в якоре для динамического специфицирования значения атрибута HREF этого якоря и обработчик onMouseOver - для специфицирования специального сообщения для окна - в свойстве status:
<A HREF="" onClick="this.href=pickRandomURL()" onMouseOver="self.status='Pick a random URL'; return true"> Go!</A>
Здесь свойство status окна присваивается свойству self окна таким образом: self.status.
Следующий пример делает окно, на
Следующий пример делает окно, на которое ссылаются, "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;
закрывает самое верхнее окно иерархии
Оператор top.close() закрывает самое верхнее окно иерархии окон .
Оператор top.length специфицирует количество фрэймов, содержащихся внутри самого верхнего окна. Если самый верхний предок определён так, top.length возвращает 3:
<FRAMESET COLS="30%,40%,30%"> <FRAME SRC=child1.htm NAME="childFrame1"> <FRAME SRC=child2.htm NAME="childFrame2"> <FRAME SRC=child3.htm NAME="childFrame3"> </FRAMESET>
Следующий пример устанавливает цвет фона фрэйма myFrame в red.
myFrame это потомок самого верхнего окна-предка.
top.myFrame.document.bgColor="red"
Для массива, созданного в результате совпадения с регулярным выражением, это индекс с базой 0 совпадения в строке.
input
Для массива, созданного в результате совпадения с регулярным выражением, отражает строку-оригинал, относительно которой выполняется подстановка регулярного выражения.
Создаёт объект
Style, который может специфицировать стили тэгов HTML.
title
Строка, специфицирующая содержимое тэга TITLE.
URL
Строка, специфицирующая полный URL документа.
vlinkColor
Строка, специфицирующая атрибут VLINK.
width
Ширина документа в пикселах.
к каждому типу события. Для
Не все свойства относятся к каждому типу события. Для изучения свойств, используемых событиями, см. разделы "События, используемые объектом еvent" конкретных обработчиков событий.
Число, специфицирующее ширину объекта при передаче с событием resize, либо горизонтальную координату курсора в пикселах относительно слоя, в котором событие возникло. Заметьте, что layerX является синонимом x.
layerY
Число, специфицирующее высоту объекта при передаче с событием resize либо вертикальную координату курсора в пикселах относительно слоя, в котором событие возникло. Заметьте, что layerY является синонимом y.
modifiers
Строка, специфицирующая ключи-модификаторы, ассоциированные с событием мыши или клавиатуры. Ключи-модификаторы это: ALT_MASK, CONTROL_MASK, SHIFT_MASK и META_MASK.
pageX
Число, специфицирующее позицию курсора по горизонтали в пикселах относительно страницы.
pageY
Число, специфицирующее позицию курсора по вертикали в пикселах относительно страницы.
screenX
Число, специфицирующее позицию курсора по горизонтали в пикселах относительно экрана.
screenY
Число, специфицирующее позицию курсора по вертикали в пикселах относительно экрана.
target
Строка, представляющая объект, которому событие было первоначально направлено. (Все события.)
type
Строка, представляющая тип события. (Все события.)
which
Число, специфицирующее нажатую кнопку, или ASCII-значение нажатой клавиши. Для мыши: 1 это левая клавиша, 2 - средняя, а 3 - правая клавиша.
width
Ширина окна или фрэйма.
x
Синоним для layerX.
y
Синоним для layerY.
Отражает текущее значение поля элемента
Свойство
Описание
form
Специфицирует форму, содержащую объект FileUpload.
name
Отражает атрибут NAME.
type
Отражает атрибут TYPE.
value
Отражает текущее значение поля элемента загрузки файла; соответствует имени загружаемого файла.
Специфицирует URL предыдущего вхождения в history.
Булево значение, указывающее, завершил ли
Свойство
Описание
border
Отражает атрибут BORDER.
complete
Булево значение, указывающее, завершил ли браузер попытку загрузки изображения.
height
Отражает атрибут HEIGHT.
hspace
Отражает атрибут HSPACE.
lowsrc
Отражает атрибут LOWSRC.
name
Отражает атрибут NAME.
src
Отражает атрибут SRC.
vspace
Отражает атрибут VSPACE.
width
Отражает атрибут WIDTH.
экземпляром которого он является. Наследует
Наследует как свойства члены public-данных из Java-класса, экземпляром которого он является. Наследует также как свойства - члены public-данных из любого суперкласса.
Свойства объекта
Свойства объекта JavaPackage являются JavaClass-объектами и любыми другими JavaPackage-объектами, которые он содержит.
Объект layer, расположенный выше данного
СвойствоОписание
above
Объект layer, расположенный выше данного объекта в порядке z-order относительно всех слоёв документа, или содержащего объекта window, если этот слой - самый верхний.
background
Изображение, используемое в качестве фона канвы слоя.
bgColor
Цвет, используемый в качестве однородного цвета фона канвы слоя.
below
Объект layer, расположенный ниже данного объекта в порядке z-order относительно всех слоёв документа, или null, если этот слой - самый нижний.
clip.bottom
Нижний край отсекающего прямоугольника (видимой части слоя).
clip.height
Высота отсекающего прямоугольника (видимой части слоя).
clip.left
Левый край отсекающего прямоугольника (видимой части слоя).
clip.right
Правый край отсекающего прямоугольника (видимой части слоя).
clip.top
Верхний край отсекающего прямоугольника (видимой части слоя).
clip.width
Ширина отсекающего прямоугольника (видимой части слоя).
document
Ассоциированный документ слоя.
left
Позиция по горизонтали левого края слоя в пикселах относительно его родительского слоя.
name
Строка, специфицирующая имя, присвоенное слою атрибутом ID тэга LAYER.
pageX
Позиция слоя по горизонтали в пикселах относительно страницы.
pageY
Позиция слоя по вертикали в пикселах относительно страницы.
parentLayer
Объект layer, который содержит данный слой, или содержащий объект window, если этот слой не вложен в другой слой.
siblingAbove
Объект layer, расположенный выше данного в порядке z-order среди всех слоёв, использующих тот же самый родительский слой, или null, если слой не имеет родственников, расположенных выше него.
siblingBelow
Объект layer, расположенный ниже данного в порядке z-order среди всех слоёв, использующих тот же самый родительский слой, или null, если это самый нижний слой.
src
Строка, специфицирующая URL содержимого слоя.
top
Позиция по вертикали верхнего края слоя в пикселах относительно его родительского слоя.
visibility
Виден слой или нет.
window
Объект window или Frame, содержащий данный слой, вне зависимости от того, вложен ли слой в другой слой.
x
Удобный синоним для Layer.left.
y
Удобный синоним для Layer.top.
zIndex
Порядок z-order расположения данного слоя относительно других слоёв-родственников.
Обратите внимание, что некоторые свойства объекта RegExp имеют длинные и сокращённые (Perl-подобные) имена. Оба имени всегда ссылаются на одно и то же значение. Perl это язык программирования, из которого JavaScript смоделировал регулярные выражения.
Свойство
Описание
$1, ..., $9
Совпадения подстрок в скобках, если имеются.
$_
См. input.
$*
См. multiline.
$&
См. lastMatch.
$+
См. lastParen.
$`
См. leftContext.
$'
См. rightContext.
constructor
Специфицирует функцию, которая создаёт прототип объекта.
global
Тестировать или нет регулярное выражение относительно всех возможных совпадений в строке, или только относительно первого совпадения.
ignoreCase
Игнорировать ли регистр при поиске совпадения в строке.
input
Строка, относительно которой выполняется поиск совпадения с регулярным выражением.
lastIndex
Индекс, с которого начинается следующее совпадение.
lastMatch
Последние совпавшие символы.
lastParen
Последнее совпадение подстроки в скобках, если имеется.
leftContext
Подстрока, предшествующая самому последнему совпадению.
multiline
Искать ли на нескольких строках.
prototype
Позволяет добавлять свойства всем объектам.
rightContext
Строка, следующая за самым последним совпадением.
source
Текст патэрна.
Специфицирует форму, содержащую объект
Свойство
Описание
form
Специфицирует форму, содержащую объект Reset.
name
Отражает атрибут NAME.
type
Отражает атрибут TYPE.
value
Отражает атрибут VALUE.
в пикселах, минус постоянные или
Свойство
Описание
availHeight
Специфицирует высоту экрана в пикселах, минус постоянные или полупостоянные настройки пользовательского интерфейса, отображаемые операционной системой, такие как Taskbar в Windows.
availLeft
Специфицирует х-координату первого пиксела, который не размещен в постоянных или полупостоянных настройках пользовательского интерфейса.
availTop
Специфицирует у-координату первого пиксела, который не размещен в постоянных или полупостоянных настройках пользовательского интерфейса.
availWidth
Специфицирует ширину экрана в пикселах, минус постоянные или полупостоянные настройки пользовательского интерфейса, отображаемые операционной системой, такие как Taskbar в Windows.
colorDepth
Битовая глубина цветовой гаммы, если она используется; иначе значение берётся из screen.pixelDepth.
height
Высота экрана монитора.
pixelDepth
Разрешение экрана монитора (в битах на пиксел).
width
Ширина экрана монитора.
или первой выбранной опции, если
Свойство
Описание
form
Специфицирует форму, содержащую список selection.
length
Отражает количество опций в списке selection.
name
Отражает атрибут NAME.
options
Отражает тэги OPTION.
selectedIndex
Отражает индекс выбранной опции ( или первой выбранной опции, если выбрано несколько опций).
type
Специфицирует, что представляемый им объект это список selection и может ли он иметь одну или более выбранных опций.
Специфицирует функцию, которая создаёт прототип
Свойство
Описание
constructor
Специфицирует функцию, которая создаёт прототип объекта.
length
Отражает длину строки.
prototype
Позволяет добавлять свойства в String-объект.
Специфицирует ширину нижней линии рамки
Свойство
Описание
align
Специфицирует выравнивание HTML-элемента относительно родительского элемента.
backgroundColor
Специфицирует сплошной цвет фона элемента.
backgroundImage
Специфицирует фоновый рисунок для HTML-элемента.
borderBottomWidth
Специфицирует ширину нижней линии рамки HTML-элемента.
borderColor
Специфицирует цвет рамки HTML-элемента.
borderLeftWidth
Специфицирует ширину левой линии рамки HTML-элемента.
borderRightWidth
Специфицирует ширину правой линии рамки HTML-элемента.
borderStyle
Специфицирует стиль рамки, такой как solid или double, вокруг HTML-элемента уровня блока.
borderTopWidth
Специфицирует ширину верхней линии рамки HTML-элемента.
clear
Специфицирует стороны HTML-элемента, которые разрешают всплывание/floating элементов.
color
Специфицирует цвет текста HTML-элемента.
display
Переопределяет обычное отображение элемента и специфицирует, отображается ли он in- line, как элемент уровня блока или как элемента списка уровня блока.
fontFamily
Специфицирует семейство шрифтов, такое как Helvetica или Arial, для текстового элемента HTML.
fontSize
Специфицирует размер шрифта для HTML-элемента.
fontStyle
Специфицирует стиль шрифта для HTML-элемента.
fontWeight
Специфицирует вес шрифта для HTML-элемента.
lineHeight
Специфицирует расстояние между базовыми линиями двух смежных строк шрифта уровня блока.
listStyleType
Специфицирует стиль символа, отображаемого в начале элемента списка.
marginBottom
Специфицирует минимальное расстояние между низом HTML-элемента и верхом прилегающего элемента.
marginLeft
Специфицирует минимальное расстояние между левым краем HTML-элемента и правым краем прилегающего элемента.
marginRight
Специфицирует минимальное расстояние между правым краем HTML-элемента и левым краем прилегающего элемента.
marginTop
Специфицирует минимальное расстояние между верхом HTML-элемента и низом прилегающего элемента.
paddingBottom
Специфицирует, какое пространство вставить между низом элемента и его содержимым, таким как текст или рисунок.
paddingLeft
Специфицирует, какое пространство вставить между левым краем элемента и его содержимым, таким как текст или рисунок.
paddingRight
Специфицирует, какое пространство вставить между правым краем элемента и его содержимым, таким как текст или рисунок.
paddingTop
Специфицирует, какое пространство вставить между верхом элемента и его содержимым, таким как текст или рисунок.
textAlign
Специфицирует выравнивание текстового HTML-элемента уровня блока.
textDecoration
Специфицирует специальные эффекты, такие как мигание, перечёркивание и подчёркивание, добавляемые к текстовому HTML-элементу.
textIndent
Специфицирует размер отступа перед первой отформатированной строкой текстового HTML-элемента уровня блока.
textTransform
Специфицирует регистр текстового HTML-элемента уровня блока.
whiteSpace
Специфицирует, должен ли сжиматься пробел внутри HTML-элемента.
width
Специфицирует ширину HTML-элемента уровня блока.
Специфицирует форму, содержащую
Свойство
Описание
form
Специфицирует форму, содержащую Submit-объект.
name
Отражает атрибут NAME.
type
Отражает атрибут TYPE.
value
Отражает атрибут VALUE.
Отражает текущее значение поля объекта
Свойство
Описание
defaultValue
Отражает атрибут VALUE.
form
Специфицирует форму, содержащую Text-объект.
name
Отражает атрибут NAME.
type
Отражает атрибут TYPE.
value
Отражает текущее значение поля объекта Text.
Специфицирует форму, содержащую
Свойство
Описание
defaultValue
Отражает атрибут VALUE.
form
Специфицирует форму, содержащую Textarea-объект.
name
Отражает атрибут NAME.
type
Специфицирует тип объекта (в данном случае Textarea).
value
Отражает текущее значение Textarea-объекта.
Отражает сообщение по умолчанию, выводимое
Свойство
Описание
closed
Специфицирует, закрыто ли окно.
crypto
Объект, дающий доступ к возможностям шифрования Navigator'а.
defaultStatus
Отражает сообщение по умолчанию, выводимое в статусной строке.
document
Содержит информацию о текущем документе и предоставляет методы для отображения вывода HTML пользователю.
frames
Массив, отражающий все фрэймы окна.
history
Содержит информацию о URL, которые клиент посетил в данном окне.
innerHeight
Специфицирует вертикальные размеры в пикселах области содержимого окна.
innerWidth
Специфицирует горизонтальные размеры в пикселах области содержимого окна.
length
Количество фрэймов в окне.
location
Содержит информацию о текущем URL.
locationbar
Адресная строка окна браузера.
menubar
Строка меню окна браузера.
name
Уникальное имя, используемое для обращения к данному окну.
offscreenBuffering
Специфицирует, выполняются ли обновления окна во внеоконном буфере.
opener
Специфицирует имя окна вызывающего документа, если окно открывается методом open.
outerHeight
Специфицирует вертикальные размеры в пикселах внешней границы окна.
outerWidth
Специфицирует горизонтальные размеры в пикселах внешней границы окна.
pageXOffset
Предоставляет текущую x-позицию в пикселах просматриваемой страницы окна.
pageYOffset
Предоставляет текущую у-позицию в пикселах просматриваемой страницы окна.
parent
Синоним окна или фрэйма, чей frameset содержит текущий фрэйм.
personalbar
Представляет personal bar окна браузера (называемый также строкой директорий).
screenX
Специфицирует x-координату левого края окна.
screenY
Специфицирует у-координату верхнего края окна.
scrollbars
Полосы прокрутки окна браузера.
self
Синоним текущего окна.
status
Специфицирует приоритетное сообщение статусной строки окна.