🗒
Docs
THESE DOCS ARE NOT COMPLETE!
The
elem
parameter is a parameter used by almost all of the quick.js methods, and takes either a querySelector ("#editMe", ".className", "p", etc) or an Element object ("document.getElementById()
", "document.getElementByClassName()
", "_.get()
", etc)Gets an element using a querySelector and returns an Element object.
Usage:
_.get(elem)
Example:
<p id="editme"></p>
<script>
var elem = _.get("#editme")
_.edit(elem, "hello there")
</script>
Edits an element's innerHTML
Usage:
.edit(elem, text)
Parameters:
text
accepts any string or number
Example:
<p id="editme"></p>
<script>
var edit = _.get("#editme")
_.edit(edit, "I was edited!") // -> <p id="editme">I was edited!</p>
_.edit("#editme", "I was edited again!") // -> <p id="editme">I was edited again!</p>
</script>
Add a class to an element.
Usage:
.addClass(elem, property, value)
Parameters:
property
takes a CSS propertyvalue
takes a value that works withproperty
Example:
<p id="#changeClass">My class will be changed!</p>
<script>
_.addClass("#changeClass", "text") // <p id="changeClass" class="text">
</script>
Removes a class from an element
Usage:
_.removeClass(elem, classname)
Parameters:
classname
takes a name of an element class
Example:
<p id="editme" class="removeMe keepMeHere"></p>
<script>
var elem = _.get("#editme")
_.removeClass(elem, "removeMe") // -> <p id="editme" class="keepMeHere"></p>
</script>
Removes a class from an element
Usage:
_.setCSS(elem, property, value)
Parameters:
property
takes the name of a CSS classvalue
takes a valid CSS value ofproperty
Example:
<p id="editme">I will red!</p>
<script>
var elem = _.get("#editme")
_.setCSS(elem, "color", "red") // -> <p id="editme">I will be red!</p> (colored red)
_.setCSS("#editme", "font-size", "25px") // -> <p id="editme">I will be red!</p> (colored red and 25px)
</script>
Add an event listener to an element
Usage:
_.on(elem, event, callback)
Parameters:
event
takes any HTML eventcallback
takes any callback function
Example:
<p id="clickme">Click me!</p>
<script>
var elem = _.get("#clickme")
_.on(elem, "click", function() {
alert("I was clicked!");
})
</script>
Hide an element on the document.
Usage:
.hide(elem)
Example:
<p id="hideme">I will be hidden!</p>
<script>
_.hide("#hideme") // Element is now hidden
</script>
Show an element.
Usage:
.show(elem)
Example:
<p id="showme">I will be shown!</p>
<script>
_.hide("#showme") // Element is now hidden
_.show("#showme") // Element is now shown
</script>
Loop a function an amount of times
Usage:
.loop(times, function)
Parameters:
times
takes an integerfunction
takes any JavaScript function
Example:
<script>
_.loop(5, function() {
document.write("Hello!")
}) // "Hello!" was written 5 times
</script>
Last modified 5mo ago