aashishrbhandari/tech_terms_revisited.txt

## tech_terms_revisited.txt
DOM ( Document Object Modal )
-------------------------------
The DOM represents a document with a logical tree.

The HTML DOM is an object-based representation of the source HTML document.


CSS & JS Query
Let's see this
---------------
HTML:
-----

<!doctype html>
<html lang="en">
 <head>
   <title>My first web page</title>
  </head>
 <body>
  <div class="mainDiv">
    <img src="/images/1.png">
    <h1>Hello, world!</h1>
    <p>How are you?</p>
  </div>
  </body>
</html>

JS:
---
document.querySelector(".mainDiv img").addEventListener( 'click', function(event) {
  console.log("Clicked on Image Inside mainDiv");
});

CSS:
----
.mainDiv img {
  height: 40%;
  width: 40%;
}

As you can see above the same query selector is used in css and js
	DOM ( Document Object Modal )
	-------------------------------
	The DOM represents a document with a logical tree.

	The HTML DOM is an object-based representation of the source HTML document.


	CSS & JS Query
	Let's see this
	---------------
	HTML:
	-----

	<!doctype html>
	<html lang="en">
	<head>
	<title>My first web page</title>
	</head>
	<body>
	<div class="mainDiv">
	<img src="/images/1.png">
	<h1>Hello, world!</h1>
	<p>How are you?</p>
	</div>
	</body>
	</html>

	JS:
	---
	document.querySelector(".mainDiv img").addEventListener( 'click', function(event) {
	console.log("Clicked on Image Inside mainDiv");
	});

	CSS:
	----
	.mainDiv img {
	height: 40%;
	width: 40%;
	}

	As you can see above the same query selector is used in css and js