Notes

BOM stands for Browser Object Model, which is a collection of objects provided by the browser to allow JavaScript to interact with and manipulate the web page's environment and the browser itself. It is a part of the web browser's architecture that allows you to control the browser window, interact with the page, and access various browser features.
1. Location Object: Represents the current URL of the page.
Host – context of a URL, host refers to the part of the URL that identifies the domain name or IP address of the server where the resource is located.
The host part in a URL includes:
Domain Name: The readable name of the server, e.g., www.example.com.
. IP Address (in some cases): Instead of a domain, an IP address like 192.168.1.1 might be used.
Example:
• URL: https://google.com/search?q=javascript
o Host: google.com
The host is the part of the URL that tells the browser or client where to send the request.
The href attribute defines the destination of a link or resource in a URL. It plays a crucial role in creating navigation within websites and across the internet.
LOCATION 
1. Features of location.object  1. Location.reload() location.reload() is a JavaScript method that reloads (refreshes) the current web page.
• To manually refresh the page using JavaScript.
• To reload the current page to see updates or changes.
Topic—changing the URL and File name in js …
2. Features of location.href -> location.href is a JavaScript property that represents the full URL of the current webpage. It can be used to get or set the URL, allowing navigation to a new page.
location.href = "https://www.example.com"; // Redirects the browser to the specified URL
• location.href is used to read or update the URL of the current page.
• Setting location.href triggers navigation or redirection.
location.href allows you to redirect the user to a different webpage by changing the URL.
Topic -- Exploring the Window Object properties like location, history, and prototype in JavaScript.
 Understanding the history object in JavaScript
History Object: Allows manipulation of the browser's history (back, forward, go to a specific page in history).
history is a built-in object that allows you to interact with the browser's session history. It provides methods to manipulate the browser's history stack, enabling navigation to previous or next pages, or going to a specific page in the history.
• history.back(): Goes back one page in the history.
history.back();

• history.forward(): Goes forward one page in the history.
history.forward();

• history.go(): Moves to a specific page in the history by specifying an index.
history.go(-1); // Goes back one page
Window inner and outer height in JavaScript
innerHeight – innerHeight is used to find the height of the visible viewport in the browser
outerHeight - outerHeight is a property in the BOM (Browser Object Model) that returns the total height of the browser window, including:
• The viewport (visible area of the web page).
• Browser toolbars, such as the address bar, tab bar, and any developer tools.
Summary - innerHeight = Visible content area height (viewport only).
outerHeight = Browser window height (viewport + toolbars).
window.outerHeight - window.innerHeight gives you the height of the browser's interface, which includes:
• The toolbar (address bar, tabs, etc.).
Topic  Explaining the window object in JavaScript
 open()
 open() opens a new tab or window.
 It returns a window object, which allows you to interact with and control the new window programmatically.
 open('https://www.youtube.com/', 'procodrr');  open(‘URL’, ‘name’)

1.'https://www.youtube.com/':
• Specifies the URL to open.
• In this case, it navigates to YouTube.
2. 'procodrr':
• Specifies the name of the new tab or window.
• If a window or tab with the name procodrr already exists, the content will load there instead of creating a new one.
• Topic  Closing windows using JavaScript
close() method in JavaScript is used to close a browser window or tab that was opened using window.open().
But when we can close it if we did not search anything or went to a URL
Topic - Resizing Windows in JavaScript
resizeTo
Define- The resizeTo(width, height) method in JavaScript allows you to set the width and height of a browser window. However, it only works on windows that were opened using window.open() and with the proper features enabled.
Conditions -;
• open('https://www.youtube.com/', 'procodrr', 'resizable'):
• Opens a new window or tab with the resizable feature enabled.
• resizeTo(600, 500):
• Resizes the new window to 600 pixels in width and 500 pixels in height
ResizeBy()
resizeBy() method JavaScript me ek window ki current size ko dynamically change karta hai by adding or subtracting pixels from its width and height.
Relative Resizing:
• Current size ke hisaab se pixels add (+) ya subtract (-) karta hai
 open('https://www.youtube.com/', 'procodrr', 'width=800,height=600,resizable')
 resizeBy(200, 100) in youtube console.
Difference
• Use resizeTo() when you need the window to have a specific size. resizeTo() method depends on the browser's available width and height
• Use resizeBy() when you want to adjust size incrementally. resizeBy() depends on the current size of the window. It adjusts the window's size relative to its current dimensions.
MoveTo
The moveTo() method in JavaScript is used to move a browser window to a specific position on the screen.
window.moveTo(x, y); syntax
• x: The new horizontal position (in pixels) of the window, relative to the screen's top-left corner.
• y: The new vertical position (in pixels) of the window, relative to the screen's top-left corner.
 MoveBy search on internet ….
 The moveBy() method in JavaScript is used to move a browser window by a specified number of pixels relative to its current position.
Assume Current Window Position: (100, 200)
• moveTo(300, 400):
o Final position: (300, 400)
• moveBy(300, 400):
o Final position: (100 + 300, 200 + 400) = (400, 600)
________________________________________
Summary:
The difference lies in how the position is calculated:
• moveTo(): Goes directly to the specified coordinates.
• moveBy(): Moves by adding to the current position.
Scroll()
The scroll() method in JavaScript is used to scroll a web page or an element to a specified position. It provides a way to programmatically control the scrolling behavior.
scrollBy or scrollTo()……..search on google
• Use scrollTo() when you need to move to a specific location.
• Use scrollBy() for relative adjustments to the current scroll position.
Print()
print the current web page.