Syntax CheatSheet

DOM

Creating Elements

const element = document.createElement(element);
const documentFragment = document.createDocumentFragment();

Adding Elements to the DOM

parentElement.appendChild(newElement);
parentElement.insertBefore(newElement, referenceElement);
// das ist alles genauso auf documentFragment anwendbar:
documentFragment.appendChild(newElement);
documentFragment.insertBefore(newElement, referenceElement);

// das documentFragment wird dann seinerseits eingefügt:
parentElement.appendChild(documentFragment);
parentElement.insertBefore(documentFragment, referenceElement);

Arrays

Array Properties

array.length on mdn

Array.length
const groceries = ['cabbage', 'tomato sauce', 'salmon'];
console.log(groceries.length); // 3

Array Methods

// Find the index of an item
Array.indexOf(itemToFind); // for primitive values

// add an item to the start
Array.unshift(item, anotherItem);
// remove an item from the start
Array.shift();  // use as often as needed
// add an item to the end
Array.push(item, anotherItem);
// remove an item from the end
Array.pop();  // use as often as needed

// add and remove items anywhere
Array.splice(index, deleteCount, itemsToAdd);

// copying an array without changing the original array
Array.slice();

Node Properties and Methods

1. Node.parentElement: gibt das Elternelement dieses Knotens zurück. Wenn der Knoten kein Elternelement hat oder der Elternteil kein Element ist, wird null zurückgegeben.
2. Node.textContent: gibt (oder setzt) den Textinhalt eines Elements und all seiner Nachfahren.

Fetch API / JSON

• JSON to JavaScript: JSON.parse(el);
• JavaScript to JSON: JSON.stringify(el);