JavaScript. Window and document objects
In this lesson we will consider key methods and properties of document and window objects. For example, we can manipulate content of html document – add new information, make selection and muc more. With window object we can manipulate windows – open it, print window content. In the end of this tutorial I offered you homework – make watches using Data object. Send me your work to my email abzalov90@gmail.com.
Code lesson
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<link rel="stylesheet" href="">
</head>
<body>
<script>
document.write("HTML документ");
document.write("<h1>HTML документ</h1>");
var root = document.documentElement;
console.log(root);
var body = document.body;
console.log(body);
document.body.style.backgroundColor = "green";
console.log(body.childNodes);
document.write(body.firstChild);
var p = document.createElement("p");
p.innerHTML = "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci deleniti sapiente ea amet quam odit culpa doloremque ab, voluptatibus modi cupiditate laborum odio! Molestiae, recusandae, voluptatem laudantium ipsam earum ab.";
p.className = "myClass";
p.setAttribute("id", "myId");
body.appendChild(p);
var el = document.getElementById("myId");
console.log(el);
var elems = document.getElementsByTagName("p");
console.log(elems);
var a = document.getElementsByClassName("myClass");
console.log(a);
var b = document.querySelector("p");
console.log(b);
var c = document.querySelectorAll("ul li");
//window
var btn = document.createElement("button");
btn.innerText = "Нажми меня";
body.appendChild(btn);
btn.onclick = function() {
//window.open("", "", "width=200, height=200");
//window.print();
console.log(window.location.href);
window.setTimeout(function(){
//alert("Привет");
}, 2000);
window.setInterval(function(){
alert("Привет");
}, 2000);
}
</script>
</body>
</html>
0 Comments