Posted by Clint on Tue 24 Mar 21:40
report abuse | download | new post
- /*
- A snippet with some methods I'm been playing with...
- Curious what people think of the method "createElementWithProps"... worth the overhead? Easier way to do it?
- */
- var FunctionObject = function() {
- var _e = [], _d = document;
- return {
- /**
- * Creates an element within the document, without a parent, as if by <code>document.createElement</code>. This method
- * has better performance in some browsers, as it caches instances of created objects and clones them, rather than manipulate the
- * document directly.
- * @param {String} t The tag name of the element to create.
- * @return {Node} A new element.
- *
- * @static
- * @function
- * @fullname Create Element
- */
- createElement : function (t) {
- var a = _e[t];
- if (!a) {
- a = _e[t] = _d.createElement(t);
- }
- if (!a) {
- return null;
- }
- else {
- return a.cloneNode(false);
- }
- },
- /**
- * Creates an element within the document, without a parent, as if by <code>document.createElement</code>. Any
- * given properites will then be set onto the newly created element. This method has better performance, as it
- * caches instances of created objects and clones them, rather than manipulate the document directly.
- * @param {String} t The tag name of the element to create.
- * @param {Object} [p] The properties to set onto the created element, (e.g. <code>{ "href" : "index.html", "name" : "theName"}</code>).
- * @return {Node} A new element.
- *
- * @static
- * @function
- * @fullname Create Element with Properties
- */
- createElementWithProps : function (t, p) {
- var e = this.createElement(t);
- return this.mergeObjects(e, p);
- },
- /**
- * Merges two option objects.
- * @param {Object} o1 The option object to be modified.
- * @param {Object} o2 The option object containing properties to be copied.
- * @param {Boolean} d True if properties on o1 should be immutable, false otherwise.
- * @return {Object} An object containing properties.
- *
- * @static
- * @function
- * @fullname Merge Objects
- */
- mergeObjects : function (o1, o2, d) {
- o1 = o1 || {};
- o2 = o2 || {};
- var p;
- for (p in o2) {
- if (p) {
- o1[p] = (o1[p] === undefined) ? o2[p] : !d ? o2[p] : o1[p];
- }
- }
- return o1;
- }
- };
- }();
- var alertAnchor = FunctionObject.createElementWithProps("A", {
- "href" : "#",
- "name" : "alertLink",
- "className" : "alert-me",
- "innerHTML" : "Click Me!",
- "onclick" : function() {
- alert('Hi!');
- }
- });
Submit a correction or amendment below (click here to make a fresh posting)
After submitting an amendment, you'll be able to view the differences between the old and new posts easily.