Coggle requires JavaScript to display documents.
document.all
document.all[2]
document.all.length
document.head
document.body
document.doctype
document.domain
document.URL
document.forms;
document.forms[0].id
document.forms[0].method
document.forms[0].action
val = document.links[0].className;
val = document.links[0].classList[0];
val = document.scripts[2].getAttribute("src");
Array.from(HTMLCollection)
let scriptsArr = Array.from(scripts);
<html>
<head>
<body>
val = window.outerWidth;
val = window.outerHeight;
val = window.innerHeight;
val = window.innerWidth;
val = window.scrollY;
val = window.scrollX;
val = window.location;
val = window.location.hostname;
val = window.location.port;
val = window.location.href;
val = window.location.search;
window.location.href = "http://google.com";
window.location.reload();
window.history.go(-2)
window.history.length
val = window.navigator;
val = window.navigator.appName;
val = window.navigator.appVersion;
val = window.navigator.platform;
val = window.navigator.language;
val = list.childNodes;
val = list.childNodes[0].nodeName;
val = list.childNodes[1].nodeType;
val = list.children;
val = list.children[3].children[0];
val = list.firstChild;
val = list.firstElementChild;
val = list.lastChild;
val = list.lastElementChild;
val = list.childElementCount;
const list = document.querySelector("ul.collection");
const listItem = document.querySelector("li.collection-item:first-child");
val = listItem.parentNode;
val = listItem.parentElement.parentElement;
val = listItem.parentElement;
val = listItem.nextSibling;
val = listItem.nextElementSibling;
val = listItem.previousSibling;
val = listItem.previousElementSibling;
document.createElement();
const li = document.createElement("li");
li.className = "collection-item";
li.id = "new-item";
li.setAttribute("title", "New Item");
li.appendChild(document.createTextNode("Hello Fag"));
document.createTextNode
document.querySelector("ul.collection").appendChild(li);
const link = document.createElement("a");
link.className = "delete-item secondary-content";
link.innerHTML = '<i class="fa fa-remove"></i>';
li.appendChild(link);
const firstLi = document.querySelector("li:first-child");
const link = firstLi.children[0];
val = link.className;
val = link.classList;
val = link.classList[0];
link.classList.add("test");
link.classList.remove("test");
val = link.getAttribute("href");
val = link.hasAttribute("href");
link.removeAttribute("title");
const newHeading = document.createElement("h2");
newHeading.id = "task-title";
newHeading.appendChild(document.createTextNode("Fag List"));
const oldHeading = document.getElementById("task-title");
const cardAction = document.querySelector(".card-action");
cardAction.replaceChild(newHeading, oldHeading);
const list = document.querySelector("ul");
const lis = document.querySelectorAll("li");
lis[0].remove();
list.removeChild(lis[3]);
addEventListener
const sec = document.querySelector('section'); sec.addEventListener('click', handler, {capture: true});
stopPropagation()
document.body.addEventListener("click", deleteItem);
if (e.target.parentElement.className === "delete-item secondary-content")
if (e.target.parentElement.classList.contains("delete-item"))
e.target.parentElement.parentElement.remove();
document.querySelector(".col").addEventListener("click", function () { ... }, true);
document.querySelector(".card-title").addEventListener("click", function () { ... }
document.querySelector(".card-content").addEventListener("click", function () { ... }
document.querySelector("form").addEventListener("submit", function (e) { ... }
localStorage.setItem("tasks", JSON.stringify(tasks));
tasks = JSON.parse(localStorage.getItem("tasks")
tasks.push(task);
tasks.forEach(function (task) { ... }
const tasks = JSON.parse(localStorage.getItem("tasks"));
json.stringify()
json.parse()
sessionStorage.setItem("name", "Beth");
localStorage.setItem("name", "John");
localStorage.removeItem("name");
const name = localStorage.getItem("name");
localStorage.clear();
clearBtn.addEventListener("click", runEvent);
function runEvent(e) { ... }
card.addEventListener("mousemove", runEvent);
heading.textContent = MouseX: ${e.offsetX} MouseY: ${e.offsetY}
const clearBtn = document.querySelector(".clear-tasks");
document.getElementsByClassName
items[0].style.color = "red";
const items = document.getElementsByClassName("collection-item");
const listItems = document.querySelector("ul").getElementsByClassName("collection-item");
document.getElementsByTagName
let lis = document.getElementsByTagName("li");
console.log(lis[0]);
lis[0].style.color = "red";
lis = Array.from(lis);
lis.reverse();
console.log(lis.length);
document.querySelectorAll
const items = document.querySelectorAll("ul.collection li.collection-item");
const liOdd = document.querySelectorAll("li:nth-child(odd)");
document.getElementById()
console.log(document.getElementById("task-title"));
console.log(document.getElementById("task-title").id);
taskTitle.style.background = "#333";
taskTitle.style.display = "none";
taskTitle.textContent = "Task List";
taskTitle.innerText = "My Tasks";
taskTitle.innerHTML = '<span style="color:red">Task List</span>';
(.)
console.log(document.querySelector(".card-title"));
(#)
console.log(document.querySelector("#task-title"));
< >
console.log(document.querySelector("h5"));
document.querySelector("li").style.color = "red";
document.querySelector("ul li").style.color = "blue";
document.querySelector("li:last-child").style.color = "red";
document.querySelector("li:nth-child(3)").style.color = "yellow";
document.querySelector("li:nth-child(odd)").style.background = "#ccc";
document.querySelector(".clear-tasks").addEventListener("click", onClick);
function onClick(e) { ... } ;
e.preventDefault()
e.target.innerText = "Hello Fag";
val = e.type;
val = e.timeStamp;
val = e.clientY; val = e.clientX;
val = e.offsetY; val = e.offsetX;
element.addEventListener("click", onClick);
const form = document.querySelector("form");
form.addEventListener("submit", runEvent);
const taskInput = document.getElementById("task");
console.log(taskInput.value);
