DEV Community

Cover image for JavaScript
Hanna
Hanna

Posted on

JavaScript

Well, that's the beginning. Here are some examples of using JavaScript.

Alt Text

document.getElementById()
Enter fullscreen mode Exit fullscreen mode

Returns the element that has the ID attribute with the specified value.
This method is one of the most common methods in the HTML DOM, and is used almost every time you want to manipulate, or get info from, an element on your document.

document.createElement()
.innerHTML
.innerText
Enter fullscreen mode Exit fullscreen mode

Creates an Element Node with the specified name.
Both innerText and innerHTML return internal part of an HTML element.
The only difference between innerText and innerHTML is that: innerText return HTML element (entire code) as a string and display HTML element on the screen (as HTML code), while innerHTML return only text content of the HTML element.

document.querySelector()
Enter fullscreen mode Exit fullscreen mode

querySelector() returns the first element that matches a specified CSS selector(s) in the document. querySelector() only returns the first element that matches the specified selectors. To return all the matches, use querySelectorAll() instead.

document.addEventListener()
document.addEventListener("mouseover", myFunction);
document.addEventListener("click", someOtherFunction);
document.addEventListener("mouseout", someOtherFunction);
Enter fullscreen mode Exit fullscreen mode

Attaches an event handler to the document.
Use document.removeEventListener() to remove an event handler that has been attached with document.addEventListener(). Use element.addEventListener() to attach an event handler to a specified element.

document.appendChild()
Enter fullscreen mode Exit fullscreen mode

Appends a node as the last child of a node. This method can be used to move an element from one element to another.

SCRIPT in the HEAD or in the BODY of HTML

When JavaScript is placed at the bottom of HTML body, it gives the HTML time to load before any of the JavaScript loads, which can prevent errors, and speed up website response time.
But putting JavaScript in the head of HTML doesnโ€™t ALWAYS cause errors.

Top comments (0)