the-modern-javascript-bootcamp/notes/chapter7_js-in-the-browser.md

Chapter 7: Javascript in Browser

Setting up a Web Server

Setting up a web server:

• Install live-server using npm:

npm install -g live-server

live-server have live-reloading feature.

Create a directory for the app.

In the app directory, create a index.html and add element in

After creating a HTML, we can view it live-server <app-directory> in browser

JavaScript in Browser

• JS embedded in HTML via <script></script>
• Or put JS code in a separate file, then import it as <script src="notes-app.js"></script>

DOM Manipulation

Use JS to manipulate HTML via Document Object Model, where document = HTML, object = JS object (i.e. Document is modeled using a JS object)

The JS object represent Document is document.

• Create an obj p and assign the queried obj to it. document.querySelector('p') select the first obj that has tag named <p>
• Script tag has to be after paragraph to query it

Adding Elements via the DOM