Toolkit:DOM manipulation

From Surebert wiki

Contents

Overview

The surebert toolkit offers a bunch of methods for DOM manipulation. These methods can be called on any Toolkit:sb.element or on any single node reference returned from $ e.g. $('#myDiv');

Manipulating Node Placement

append

Appends another DOM element to the element as a child

javascript code

myElement.append(myOtherElement);

appendTo

Appends the element to another DOM element as a child e.g. appends myElement to a div with the ID "myDiv"

javascript code

myElement.appendTo('#myDiv');

appendBefore

Appends the element before another DOM element as a sibling

e.g. Append myElement to the parent of "#myDiv" as a sibling of "#myDiv" directly before "#myDiv"

javascript code

myElement.appendBefore('#myDiv');

appendAfter

Appends the element after another DOM element as a sibling

e.g. Append myElement to the parent of "#myDiv" as a sibling of "#myDiv" directly after "#myDiv"

javascript code

myElement.appendAfter('#myDiv');

appendToTop

Appends the element to the top DOM element as a child

e.g. appends myElement to a div with the ID "myDiv"

javascript code

myElement.appendToTop('#myDiv');

remove

Removes an element from the DOM

javascript code

myElement.remove();

replace

Replaces an element with another element in the DOM

javascript code

myElement.replace('#myOtherElement');