当前位置：网站首页>Operate BOM objects (key)

Operate BOM objects (key)

2022-07-03 20:25:00 【Sicheng code block】

Hello everyone , Today, let's share the operation BOM object

BOM: Browser object model

JavaScript And the browser was born so that it can run on the browser

browser ：
IE
Chrome
Safari
FireFox

Third party browsers
qq browser
360 browser

window object

window For browser window
Insert picture description here

window.alert(1)
undefined
window.innerHeight
1440
window.innerWidth
669
window.outerHeight
360
window.outerHeight
360
window.outerWidth
167

window.navigator.appName
'Netscape'
window.navigator.appVersion
'5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/98.0.4758.82 Mobile Safari/537.36'
window.navigator.userAgent
'Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/98.0.4758.82 Mobile Safari/537.36'
window.navigator.platform
'Win32'

Most of the time , We don't recommend it navigator object , Because these can be artificially modified

screen
Represents the screen size

screen.width
804
screen.height
625

location( important )
Representing the current page URL Information

Screenshot ：

host:   "www.baidu.com"
href:"https ://www.baidu.com/"
protocol  : "https:"
reload  :f    reload ()     // Refresh web page 
location.assign('https://www.xxxx.com/' )
      ')     // Add a new web page after it

Location {ancestorOrigins: DOMStringList, href:
‘https://www.baidu.com/’, origin: ‘https://www.baidu.com’, protocol:
‘https:’, host: ‘www.baidu.com’, …}ancestorOrigins: DOMStringList
{length: 0}assign: ƒ assign()hash: ""host: "www.baidu.com"hostname:
"www.baidu.com"href: "https://www.baidu.com/"origin:
"https://www.baidu.com"pathname: "/"port: ""protocol: "https:"reload:
ƒ reload()replace: ƒ replace()search: ""toString: ƒ toString()valueOf:
ƒ valueOf()Symbol(Symbol.toPrimitive): undefined[[Prototype]]:
Location

document

document Represents the current page ,

 document.title 
 ' use Baidu Search '

Screenshot ：
Insert picture description here

Insert picture description here

Write a source code ：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <dl id="app">
        <dt>java</dt>
        <dd>docker</dd>
        <dd>mysql</dd>
        </dl>
    <script>
        var dl=document.getElementById('app');
    </script>
</head>
<body>

</body>
</html>