A JavaScript library is a library of pre-written JavaScript which allows for easier development of JavaScript-based applications, especially for AJAX and other web-centric technologies....
that aims to make JavaScript web development easier. It was created by Aycan Gulez.
The Document Object Model is a cross-platform and language-independent convention for representing and interacting with objects in HTML, XHTML and XML documents. Aspects of the DOM may be addressed and manipulated within the syntax of the programming language in use...
In the area of graphical user interfaces , a tabbed document interface is one that allows multiple documents to be contained within a single window, using tabs as a navigational widget for switching between sets of documents...
Autocomplete is a feature provided by many web browsers, e-mail programs, search engine interfaces, source code editors, database query tools, word processors, and command line interpreters. Autocomplete involves the program predicting a word or phrase that the user wants to type in without the...
A cookie, also known as an HTTP cookie, web cookie, or browser cookie, is used for an origin website to send state information to a user's browser and for the browser to return the state information to the origin site...
A webform on a web page allows a user to enter data that is sent to a server for processing. Webforms resemble paper or database forms because internet users fill out the forms using checkboxes, radio buttons, or text fields...
, string and array utility methods
Use
midori consists of 10 modules and is available as a single JavaScript file. It can be included within any web page by using the following markup:
midori allows the use of standard CSS syntax to access DOM elements, and supports most CSS2 and CSS3 selectors. There are three ways to work on returned DOM elements.
Passing JavaScript code to modify a single property, using the built-in apply method:
// Sets the background color of all the cells in even rows to "yellow" in the "cities" table
midori.get('#cities tr:nth-child(even) td').apply('style.backgroundColor = "yellow"');
Passing a function that takes a single parameter for more complex operations, again using the apply method:
// Marks the cells whose values are 12 or bigger in the "cities" table
midori.get('#cities td').apply(function (o) {
if (parseInt(o.innerHTML) >= 12) o.style.backgroundColor = 'red';
} );
Directly accessing array entries returned by midori.get is also possible.
// Returns the first div element
var firstDiv = midori.get('div')[0];
