Материалы представленные на сайте исключительно с целью ознакомления пользователям Интернета и не преследуют коммерческих целей или нарушение авторских прав.
© 2018 - 2024
• Создание
l Параметры задаются строкой
l Поведение зависит от браузера
l Возвращается ссылка на объект окна
var ncwin = window.open('http://www.netcracker.com',
' Сайткомпании ', 'directories=no,height=300,location=no,' +
'menubar=no,resizable=yes,scrollbars=yes,' +
'status=no,toolbar=no,
• Закрытие
ncwin.close();
Запуск новых потоков
• Запуск нового потока
l setTimeout(" код ", времяВМиллисекундах )
l Возвращает ссылку на поток
• Остановка запущенного разового потока
l clearTimeOut( ссылкаНаПоток )
• Периодический запуск нового потока
l setInterval(" код ", времяВМиллисекундах )
l Возвращает ссылку на поток
• Остановка запущенного периодического потока
l clearInterval( ссылкаНаПоток )
Свойства window
• location – объект «типа» URL, текущий адрес
l href – собственно URL
l Набор свойств, соответствующих фрагментам URL
l Методы
l replace()
l reload()
• history – объект, хранящий историю переходов по страницам
l forward()
l back()
l go( количествоСтраниц )
• navigator – объект, хранящий данные о браузере
• opener – ссылка на родительское окно
Объект document
• В нём и живёт DOM.
• Это тоже ассоциированный массив специфического вида.
• Все теги получают в соответствие объект.
l Имя объекта определяется значением атрибута name тега.
l Атрибуты тегов становятся свойствами соответствующих объектов.
l Не все свойства объектов соответствуют атрибутам тегов.
• Объекты формируются по ходу чтения документа браузером.
• Некоторые виды объектов объединяются в дополнительные массивы (формы, ссылки и т.д.).
• У объектов могут быть события.
• У объектов могут быть дополнительные методы.
Прямая запись в документ
• Методы
l document.write( значение )
l document.writeln( значение)
• Используются для генерирования (в т.ч. условного) содержимого документа.
• Можно использовать только если документ ещё «открыт».
l Для загружаемых документов – документ ещё не до конца прочитан браузером.
l Для документов в динамически открытых окнах – после вызова document . open () и до вызова document . close ().
• Если документ уже закрыт, то его можно изменять только через объекты и управление ими.
События объектов
• Обычно именуются onчто-нибудь.
• Обработчик можно указать прямо в HTML-коде.
• Обработчик можно задать программно.
• Возврат из некоторых обработчиков null означает прекращение обработки.
Пример 43.
<html>
<body>
<p
onMouseOver="document.getElementById('addition').innerHTML = ' Аонесть ...'"
onMouseOut="document.getElementById('addition').innerHTML = ''">
Видишьсуслика ?..</p>
<p id="addition"></p>
<img id="picture" src="http://turbo-suslik.ru/images/suslik.jpg"
height="150px"/>
<script>
document.getElementById("picture").onclick = function() {
alert ("Вот же он, суслик!")};
</ script >
</ body >
</ html >
Пример 44. Динамическое изменение DOM
<html>
<body>
<table border="1px" id="table">
<head id="head"><td> Фамилия </td><td> Имя </td></head>
<tr><td> Иванов </td><td> Иван </td></tr>
</table>
<form name="mainform">
Фамилия :
<input type="text" name="sname"/><br/>
Имя :
<input type="text" name="fname"/><br/>
<input type="submit" name="addition" value=" Добавить "
onClick="appendToTable(document.mainform.fname.value, document.mainform.sname.value); return false;"/>
</form>
<script>
function appendToTable(fname, sname) {
var table = document.getElementById("table");
var row = document.createElement("tr");
var surname = document.createElement("td");
var firstname = document.createElement("td");
surname.innerHTML = sname;
firstname.innerHTML = fname;
row.appendChild(surname);
row.appendChild(firstname);
table.appendChild(row);
}
</script>
</body>
</html>
Работа с формами
• Доступ к форме:
l По имени как к свойству документа
l В массиве document.forms
• Доступ к элементам:
l По имени как к свойству формы
l В массиве elementsформы
• Атрибуты тегов элементов формы и самой формы – свойства соответствующих объектов.
• События формы:
l onsubmit
l onreset
• Методы формы
l submit()
l reset()
Дата: 2019-02-19, просмотров: 294.