Объектная модель браузера (BOM)
Цель работы
Познакомиться с объектной моделью браузера, изучить объекты и
их свойства, позволяющие управлять поведением браузера из JavaScript.
Задания
Задание 1
Создать кнопки, открывающие и закрывающие окна с произвольными именами. Создать кнопки, выводящие в каждое из окон какой-нибудь текст, включающий имя окна. Проверить работу скрипта в разных браузерах.
Решение
Java Script
let i = -1
let myWindow = new Array()
function myWindowOpen() {
let newWindow = window.open("", "", "top=100, left=500, width=700, height=500")
newWindow.document.write('<title>Название окна</title>')
myWindow.push(newWindow)
i++
}
function myWindowClose() {
if (myWindow[i]){
myWindow[i].close()
myWindow.pop()
i--
}
}
function myWindowText() {
myWindow[i].document.write('<p>Название окна</p>'
+ 'Lorem ipsum dolor sit, amet consectetur adipisicing elit. Maxime ipsum dicta,
ipsam dolores similique repudiandae officiis. Harum deserunt ut consectetur incidunt,
facilis architecto nemo commodi aperiam itaque officia. Maxime et nam, blanditiis
nobis exercitationem atque optio qui, a magnam quia eligendi, reprehenderit quidem
dolor laboriosam esse repellat? Voluptas, neque eveniet!')
}
Задание 2
Узнать:
1) всю информацию о браузере пользователя;
2) версию браузера;
3) название браузера;
4) кодовое название браузера;
5) ОС, которую использует пользователь;
6) включена ли поддержка Java в браузере;
7) ширину и высоту экрана;
8) глубину цвета;
9) URL, которые были посещены в данном окне браузера;
10) URL текущего документа;
11) путь к загруженному документу;
12) имя домена загруженного документа.
Результаты вывести в таблице:
1) всю информацию о браузере пользователя;
2) версию браузера;
3) название браузера;
4) кодовое название браузера;
5) ОС, которую использует пользователь;
6) включена ли поддержка Java в браузере;
7) ширину и высоту экрана;
8) глубину цвета;
9) URL, которые были посещены в данном окне браузера;
10) URL текущего документа;
11) путь к загруженному документу;
12) имя домена загруженного документа.
Результаты вывести в таблице:
Свойство | Значение |
Решение
Java Script
let methods = new Array(
navigator.userAgent,
navigator.appVersion,
navigator.appName,
navigator.appCodeName,
navigator.platform,
navigator.javaEnabled(),
screen.width,
screen.height,
screen.colorDepth,
history.length,
location.href,
location.pathname,
location.host
)
let methodsName = new Array(
"userAgent",
"appVersion",
"appName",
"appCodeName",
"platform",
"javaEnabled()",
"width",
"height",
"colorDepth",
"length",
"href",
"pathname",
"host"
)
document.write('<table><tr>'
+ '<th>Свойство</th>'
+ '<th>Значение</th></tr>')
for(let i = 0; i < 13; i++){
document.write('<tr>')
for(let j = 0; j < 1; j++){
document.write('<td>' + methodsName[i] + '</td>')
document.write('<td>' + methods[i] + '</td>')
}
document.write('</tr>')
}
document.write('</table>')