Too much recursion 

Higher Order Javascript

 



   Subscribe in NewsGator Online    Subscribe in Rojo    Add to Google      Add to My AOL   Subscribe in FeedLounge   Add to netvibes  

Brendan Eich's Roadmap  Standard ECMA-262  www.schillmania.com  www.quirksmode.org 
www.snook.ca  www.davidflanagan.com  www.kryogenix.org  www.thomasfrank.se 
www.dustindiaz.com  Yahoo! UI Library  www.crockford.com  www.brainjacked.com 
chadlindstrom.ca  www.browserland.org     
       

Sunday, August 20, 2006

 

Easy Class setTimeout call keeping 'this'


I'm working on an a.p.i called this.js. Its a jquery clone in its functionality... I needed to call functions within the same class, keeping this all the same. (arguments can be passed using the same technique, but it borks in IE6..its better to have the arguments as class members anyway). Here is some code from this.js showing the technique:
/// fadeIn 
this.fadeIn= function ( speed, delay ){
this.el.style.visibility='visible';
this.op(0); this._fadeIn.count = 0;
if (delay) { var _me=this;
setTimeout( function(){_me._argList[1]= speed; _me._fadeIn()}, delay*1000, _me );
} // call the fade function and returns this
else{ this._argList[1]= speed; this._fadeIn() }; return this;
};

Sunday, August 06, 2006

 

DOM Node Creation Helpers


These are the foundation of this.js(another a.p.i!), available for download.
// DOM Node Creation Helpers R.E.M. Aug.2006
// Generic Get Element, $, getEl()
// Args:[id],[element],[array]of.. Returns: [element] or [array] of elements
var $ = function getEl(e) {
if (typeof e == 'string') {return window.document.getElementById(e);}
if (e[0]) {var i=e.length; while(i--){e[i]=arguments.callee(e[i]);}return e;}
return e; //element
}
// Generic Append Element(),$A, appendElement()
// Appends [element] to [element] or [Array] of elements
var appendElement = $A =function(bag, marbles) {
if (marbles.constructor == Array){var l=marbles.length,i;
for(i=0;i else {bag.appendChild(marbles);} return bag;
}
// Generic Create Element, $X, exNihilo()
// Creates element and/or adds attributes to node and/or adds styles to node
var exNihilo = $X =function (el,attributes,styles) {
if (el==='textnode')
{ return document.createTextNode(((attributes)? attributes:' ')); }
var node=(el.constructor==String)?document.createElement(el): el,arg;
if (attributes){for (arg in attributes){node[arg]=attributes[arg];} }
if (styles) {for (arg in styles) {node.style[arg]= styles[arg];} }
return node;
}

Friday, August 04, 2006

 

FireFox innerText


FireFox, Opera innerText fix:
// Firefox InnerText R.E.M 2006
// Credits: Matthias Hertel , Erik Arvidsson, check by jvance
// emulates IE's innertext on Firefox's Proprietary __defineGetter__
if (typeof HTMLElement != "undefined" && typeof HTMLElement.prototype.__defineGetter__ != "undefined") {
HTMLElement.prototype.__defineGetter__("innerText", function () {
if (this.textContent) { return(this.textContent) }
else{var r=this.ownerDocument.createRange(); r.selectNodeContents(this);return r.toString();}});
HTMLElement.prototype.__defineSetter__("innerText", function (sText) {
if (this.textContent) {this.innerHTML=sText.textContent; }
else {this.innerHTML = sText.replace(/\&/g, "&").replace(//g, ">"); }} );
}
// opera innerText is broken
String.fixText=function($INPUT) {
return $INPUT.replace(/\&/g, "&").replace(/\</g, "<").replace(/\>/g, ">");
}

 

DOM Node Creation Helper Function-updated


Updated: Added functionality for text node creation: Just pass in node type as 'textnode' and then the second argument is your text, defaults to if omitted.


Updated: Now you can use it to add styles or attributes to an existing node. Just pass in the node (instead of a type of node).

// Generic Create Element,  $X,  exNihilo() R.E.M. 2006 
// Creates element and/or adds attributes to node and/or adds styles to node
var exNihilo = $X =function (el,attributes,styles) {
if (el==='textnode')
{ return document.createTextNode(((attributes)? attributes:' ')); }
var node=(el.constructor==String)?document.createElement(el): el,arg;
if (attributes){for (arg in attributes){node[arg]=attributes[arg];} }
if (styles) {for (arg in styles) {node.style[arg]= styles[arg];} }
return node;
}

You can call it with some code like this:
var node=exNihilo( 'span',
{innerHTML:'hello World'},
{border:'2px solid red',padding:'20px'} )

document.body.appendChild(node);
To add styles or attributes to existing nodes, pass in a node[element] instead of nodeType[string]:

// change/add color style of node
$X(node,0,{color:'#ff0000'})

Archives

June 2006   July 2006   August 2006   September 2006  

This page is powered by Blogger. Isn't yours?