CSS Chapter 4: Cookies and Browser Data
Browser Data:
1. Opening a Window
- You can open a new browser window using `window.open()`. This method
allows you to define the URL, window name, and window features like size.
Code:
let childWindow = window.open("child.html", "Child Window",
"width=400,height=300");
2. Giving the New Window Focus
- After opening a window, you can bring it to the front using `focus()`. This
ensures the newly opened window gets the user’s attention.
Code:
childWindow.focus();
3. Window Position
- You can set the position of the new window by specifying `top` and `left` in
`window.open()`. This controls where the window appears on the screen.
Code:
let childWindow = window.open("child.html", "Child Window",
"width=400,height=300,top=100,left=200");
4. Changing the Content of Window
- You can dynamically change the content of the new window by
manipulating its `document` object after the window has opened.
Code:
childWindow.document.body.innerHTML = "<h1>New Content</h1>";
5. Closing a Window
- A window can be closed programmatically using the `close()` method. The
user can also manually close the window.
Code:
childWindow.close();
6. Scrolling a Web Page
- You can scroll a page programmatically using the `scrollBy()` or `scrollTo()`
methods, specifying the x and y coordinates for the scroll position.
Code:
window.scrollBy(0, 100); // Scroll down by 100 pixels
7. Multiple Windows at Once
- You can open multiple windows by calling `window.open()` multiple times
and storing the references in an array.
Code:
let windows = [];
windows.push(window.open("child.html", "Child Window",
"width=400,height=300"));
8. Creating a Web Page in New Window
- You can create an entire new webpage by passing a URL or using
`document.write()` to build content dynamically in the newly opened window.
Code:
let newWindow = window.open();
newWindow.document.write("<h1>New Webpage</h1>");
1. JavaScript in URLs:
JavaScript code can be run directly from a URL or bookmarklet. This is risky
because it can execute harmful code if not used carefully.
2. JavaScript Security:
JavaScript is vulnerable to attacks like XSS and CSRF, which can steal data or
perform unauthorized actions. Always validate inputs and use security
measures like CSP.
3. Timers:
JavaScript uses `setTimeout()` to delay actions and `setInterval()` to repeat
them at set intervals. This is useful for animations or timed tasks.
4. Browser Location:
The `window.location` object controls and retrieves information about the
current URL. It can be used to redirect users or reload the page.
5. Browser History:
JavaScript can access and navigate the browser’s history using
`window.history`. This lets users move back or forward through pages with
code.
