@frostsw/frostjs v1.2.21

FrostJS

A lightweight JS for basic DOM manipulation and more.

FrostJS Initialisation

You can initialise FrostJS using fr alias

You can have multiple fr(function(){ }); in a single script if necessary, but keep in mind that one of this instance will be enough. fr() functions, or any function, that is used to bind events must be called through this function, otherwise the browser will throw fr is undefined error.

<hr/>
<h4>Numbers Only</h4>
<input type ="text" id="txtText" value = "sample value"/><br/>
<pre>

fr("#txtText").typing(FrostJS.Typing.NUMBERS);

<hr/>
<h4>Titlecase</h4>
<textarea id="area">This is a text area</textarea><br/>
<pre>

fr("#area").typing(FrostJS.Typing.TITLECASE);

<hr/>
<h4>Binding an event</h4>
<p>You can bind an event to an element using .on() method. For list of DOM events, click <a href="https://www.w3schools.com/jsref/dom_obj_event.asp">here.</a></p>
<p class="mono">
    Syntax:<br/>
<mono>frObject.<b>on</b>("<b>event_name</b>", <i>callback</i>);</mono>
<br/><br/>
callback must be in a form of 
<i>
    <mono>anonymous function</mono>
</i> or an existing 
<i>
    <mono>function name</mono>
</i>.

// Using an existing function name: fr("#myBtn").on("blur", myFunction);

function myFunction(){ //code to trigger }

fr("#switch2").on("click", function (e) { fr("#switch2").class("active", "inactive"); fr("#switch1").class("inactive", "active"); });