zjrJS.Doc.etn() - Beta Test Suite for zjrJS

This information lives on a webpage hosted at the following web address: 'https://www.omegajunior.net/code/zjrjs/beta.php'.

How to use zjrJS.Doc.etn() ("elements by tag name")

Used zjrJS Version:

Stable Minified version 20141202t2322 of zjrJS.

There is no newer Beta version available.


 

Declaration
zjrJS.Doc.etn(String tagName, Optional HtmlElement Parent)

Goal
A short-cut for getElementsByTagName(), etn() ensures all needed objects and functions do exist, and if no Parent HtmlElement is provided, it will default to document as its parent.

Typical usage
Wherever you wish to retrieve a collection of elements based on their HTML tag name, like retrieving all HtmlParagraphElements by their p tag.

Member Type
Function.

Value Type
Node List (collection of the found HtmlElements).
If no element in the current web page bears the provided tagName, the returned Node List has a length of 0 (zero).
If no tagName was supplied, or if the supplied Parent element proved undefined, the function returns null instead, resulting in a TypeError with the very next statement that expected a Node List instead.

Parameters
String tagName: any lowercase HTML tag name. Mind you that you are responsible for choosing tag names. Refer to the Html4 or Html5 recommendations over at W3C.
Optional HtmlElement Parent: the element that serves as the starting point from which to retrieve child elements. This parameter is optional: if omitted or null, etn() will retrieve the fitting children of the document element (usually the body) instead.

Dependencies
None.

Example
<script type="text/javascript" src="zjrJS.version.js" id="zjrJS"></script>
<script type="text/javascript">/* <![CDATA[ */
zjrJS.Doc.aE(window,"load",function(){
//reference the Doc object
var D=zjrJS.Doc;
//retrieve all HtmlParagraphElements
var P=D.etn("p");
if(P){
//do something
for(var i=0, j=P.length; i<j; i++){
P[ i ].style.backgroundColor="#eeeeff";
}
}
//clean up memory
D=P=null;
});
/* ]]> */</script>



Can we get this done in less code?

JQuery:
$("p").each(function(){$(this).css("background-color","#eeeeff")});

Equivalent zjrJS:
var P=D.etn("p");for(var i=0;i<P.length;i++){P[ i ].style.backgroundColor="#eeeeff"}
Yes, JQuery appears to allow the developer to achieve the same in less code.

Download:

Download zjrJS’ latest stable build (20141202t2322) minified (7.1KB).

Download zjrJS’ latest stable build (20141202t2322) (11.9KB).