JavaScript Tutorials
- What is Javascript?
- What is BOM?
- What is DOM?
- Variable
- check variable value is empty
- JavaScript Output
- Functions
- Javascript Events
- Input Events
- onchange Event
- Javascript Output methods
- If else statement
- Arrays
- Pattern Validation
- Form Validation
- Inner Html Form Validation
- Inline Form Validation
- Checkbox Validation
- Inline Inner Html Form Validation
- Server side php Validation
- Validate a HTML Form with PHP
- window and window location
- Get Text Value
- Get hidden field value
- JavaScript & PHP
- Date Format
- get php value in javascript
- Redirect page & Autoredirect page
- Auto Refresh page & Div
- How to get select text value from Dropdown box
- How to clear browser history in javascript
- Checkbox Problems
- Select option problems
- Popup Contact Form
- Sidebar Contact Form
- How to use a multistep Form or Form wizard
- Auto Calculate Price
- print Application Form
- Auto Calculate GST in Javascript by select price
- Calculate GST by input value in text box Jquery
- Calculate Discount
- onClick Checkbox
- autofil form data click on checkbox
- Show subcategory list
- Show city list as per state
- Show district list as per country and state
- Show good morning good night wish
- image upload with preview image
- Print Div Content
- Show modal popup on page load
- filter table data usign javascript.
- Character Limit Validation.
- Validate File 5MB Upload
- Validate Special character
- More File Upload
- Call JavaScript Function After Page Load
- Drop Down First option Value Disabled --- Please Select ---
- How to Disable Submit Button After Form Submission
- How to disable browser back button using Jquery?
- How to Remove selected item from second & third dropdown list?
- Interview Questions of JavaScript.
Important Link
Home » JavaScript »
window
JavaScript Window - The Browser Object Model
The Browser Object Model (BOM) allows JavaScript to "talk to" the browser.
- The Window Object
- The window object is supported by all browsers. It represents the browser's window.
- Global functions are methods of the window object.
- Even the document object (of the HTML DOM) is a property of the window object: window.document.getElementById("header");.
- document.getElementById("header");
Examples window :-
File Name:- index.php
<body><p id="demo"></p>
<script>
var w = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
var h = window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;
var x = document.getElementById("demo");
x.innerHTML = "Browser inner window width: " + w + ", height: " + h + ".";
</script>
</body>
Some other methods:
Window Screen
The window.screen object contains information about the user's screen.
The window.screen object can be written without the window prefix.
Examples window screen width :-
File Name:- index.php
<body><p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
"Screen width is " + screen.width;
</script>
</body>
Examples window screen height :-
File Name:- index.php
<body><p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
"Screen height is " + screen.height;
</script>
</body>
Window Location :
The window.location object can be used to get the current page address (URL) and to redirect the browser to a new page.
Some examples:
Window Location Href :-
The window.location.href property returns the URL of the current page.
File Name:- index.php
<body><p>Display the entire URL of the current page.</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
"Page location is: " + window.location.href;
</script>
</body>
Window Location Assign :-
The window.location.assign() method loads a new document.
File Name:- index.php
<head><script>
function newDoc() {
window.location.assign("http://www.gmaxlifesciences.com")
}
</script>
</head>
<body>
<input type="button" value="Load new document" onclick="newDoc()">
</body>
Window Location Hostname :-
File Name:- index.php
<head><script>
function newDoc() {
window.location.assign("http://www.gmaxlifesciences.com")
}
</script>
</head>
<body>
<input type="button" value="Load new document" onclick="newDoc()">
</body>
Window Location Pathname :-
The window.location.pathname property returns the pathname of the current page.
File Name:- index.php
<body><p>Display the path name of the current URL.</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
"Page path is: " + window.location.pathname;
</script>
</body>
Window Location Protocol :-
The window.location.protocol property returns the web protocol of the page.
File Name:- index.php
<body><p>Display the protocol portion of the current URL.</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
"Page protocol is: " + window.location.protocol;
</script>
</body>
How to get screen size and execute some script on screen size.
File name : index.php
<script type="text/javascript">
var width = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
if (width > 500) {
//<![CDATA[
LSM_Slot({
adkey: '68d',
ad_size: '728x90',
slot: 'slot28415'
});
//]]>
}
</script>
<script type="text/javascript">
var width = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
if (width < 500) {
//document.write('<scr' + 'ipt type="text/javascript" src="http://ad.leadboltmobile.net/show_app_ad.js?section_id=386133869"></scr' + 'ipt>');
<br>
}</script>
<script src="//ads.lfstmedia.com/getad?site=92184" type="text/javascript"></script>
<script type="text/javascript">
var width = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
if (width > 500) {
//<![CDATA[
LSM_Slot({
adkey: '68d',
ad_size: '728x90',
slot: 'slot28415'
});
//]]>
}
</script>
</script>
<script type="text/javascript">
var width = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
if (width < 500) {
//document.write('<scr' + 'ipt type="text/javascript" src="http://ad.leadboltmobile.net/show_app_ad.js?section_id=386133869"></scr' + 'ipt>');
<br>
}</script>
</div>
<div class="mobad">
<!--
<script type="text/javascript">
atOptions = {
'key' : '3df2178091dc47b565af8f67e1c22212',
'format' : 'iframe',
'height' : 250,
'width' : 300,
'params' : {}
};
document.write('<scr' + 'ipt type="text/javascript" src="http' + (location.protocol === 'https:' ? 's' : '') + '://www.bnhtml.com/invoke.js"></scr' + 'ipt>');
</script>
-->
</div>
<script type="text/javascript">
var width = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
if (width > 500) {
//<![CDATA[
LSM_Slot({
adkey: '68d',
ad_size: '728x90',
slot: 'slot28415'
});
//]]>
}
</script>
</script>
<script type="text/javascript">
var width = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
if (width < 500) {
//document.write('<scr' + 'ipt type="text/javascript" src="http://ad.leadboltmobile.net/show_app_ad.js?section_id=386133869"></scr' + 'ipt>');
<br>
}</script>
</div>
<div class="mobad">
<!--
<script type="text/javascript">
atOptions = {
'key' : '3df2178091dc47b565af8f67e1c22212',
'format' : 'iframe',
'height' : 250,
'width' : 300,
'params' : {}
};
document.write('<scr' + 'ipt type="text/javascript" src="http' + (location.protocol === 'https:' ? 's' : '') + '://www.bnhtml.com/invoke.js"></scr' + 'ipt>');
</script>
-->
</div>