DOM Control
Selecting
Can put any selector in string for jsss
document.getElementById().getElementByTagname("input")
document.querySelector('.class')//return first
document.querySelectorAll('.class')//return NodeList(not array so no forEach?)
Modifying Elements
Can retrieve or set any attribute
document.getElementById("myname").type="radio"
document.getElementById("myname").value="Jorge"
elem.style.display = 'none';
Creating Elements
const container = document.createElement("div");
container.setAttribute("id", containerId);
document.body.appendChild(container);
Deleting Elements
const container = document.getElementById(containerId);
if (container === null) return;
container.parentNode.removeChild(container);
Other DOM Stuff
URL
window.location.href //full url
window.location.reload()
Scrolling
window.scrollBy(x-coord, y-coord);
window.scrollBy(options)
Options is a dict of
top
i,ey-coord
left
i.ex-coord
behavior
=smooth
|instant
|auto
Get Forms
document.forms
document.forms.myform
document.theform([name of form])
JQuery
$( '#header' ); // select the element with an ID of 'header'
$( 'li' ); // select all list items on the page
$( 'ul li' ); // select list items that are in unordered lists
$( '.person' ); // select all elements with a class of 'person'
Last updated