Manage HTML Elements

Setting and getting innerHTML

Simply use u().set(innerHTML) and u().get()

Note: Most commands that get data, such as u().get() return the value of the first result. For example, <p>hello</p><p>world</p> and u("p").get() will return "hello". See Extracting Elements

Attributes

u.set(attr,value) and u().get(attr) are used for attributes

Multiple uses

Many UltraLangScript commands have multiple uses. UltraLangScript automatically determines what to do based on arguments and the type of selector used.

Event listeners

Event listeners can be added using u().on(event,listener). For example, u("p").on("click",function (){u("p").set("clicked!")}).

Adding Children

Use u().add(childUltraLangObject) to add children.

Note: This ONLY accepts UltraLang element objects. Use u("div").add(u("<p>hello</p>")), not u("div").add(document.getElementById("p"))

Classes

There are 4 methods used for editing classes, as well as u().set("class").

Add

The u().add(".class") method adds classes.

Note: All UltraLangScript class methods MUST have a dot in the arguments, to avoid conflict with other uses of the same method.

Remove

Use u().remove(".class") to remove classes.

Check existence

Use u().exists(".class") to check if an element has a class. Returns Boolean.

Toggle

Use u().toggle(".class") to toggle a class.

Note: If you are selecting multiple elements and some have the class, it will still be toggled, so <p class="hello">hi</p><p>bye</p> becomes <p>hi</p><p class="hello">bye</p> with u("p").toggle(".hello").

Extracting Elements

You can create a new UltraLangScript element object of one of the results of a selector using u().get(result). For example, <p>hi</p><p>bye</p> becomes <p>good</p><p>bye</p> with u("p").get(0).set("good").

Search

This is useful for searching elements with a certain selector. u().search(query) will return an UltraLangScript element, which you can use to show the results. Example:

HTML:

<input type="search">
<p>result one</p>
<p>result two</p>
<p>result three</p>

JS:

u(window).on("load",function (){// On load
u("input").on("keypress",function (){// When query is edited
u("p").set("hidden","hidden");// Hide results
var query = u("input").get("value");// Get query
var results = u("p").search(query);// Get results
results.set("hidden","");// Show results
})})