From 7516cf8c001d4ca17e4b35edee8d0102455913a8 Mon Sep 17 00:00:00 2001 From: rolux Date: Fri, 6 Dec 2013 10:26:31 +0100 Subject: [PATCH] Ox.$: add missing methods (replace, replaceWith, siblings, text), + cosmetic changes --- source/Ox/js/DOM.js | 78 +++++++++++++++++++++++++++++++++++---------- 1 file changed, 61 insertions(+), 17 deletions(-) diff --git a/source/Ox/js/DOM.js b/source/Ox/js/DOM.js index ee09d28d..0ed04068 100644 --- a/source/Ox/js/DOM.js +++ b/source/Ox/js/DOM.js @@ -115,7 +115,7 @@ Ox.$ = Ox.element = function(value) { }, /*@ children Returns the children of this element - () -> <[o]> Children + () -> <[h]> Children @*/ children: function() { return Ox.slice(this[0].childNodes); @@ -149,7 +149,7 @@ Ox.$ = Ox.element = function(value) { }, /*@ find Find descendant elements - ([selector]) -> Elements + ([selector]) -> <[h]> Elements selector CSS selector @*/ find: function(string) { @@ -213,18 +213,17 @@ Ox.$ = Ox.element = function(value) { }, /*@ next Returns the sibling after this element - () -> Next element + () -> Next element @*/ next: function() { return this[0].nextSibling; }, /*@ nextAll Returns all siblings after this element - () -> <[o]> Next elements + () -> <[h]> Next elements @*/ nextAll: function() { - var sibling = this[0], - siblings = []; + var sibling = this[0], siblings = []; while (true) { var sibling = sibling.nextSibling; if (!sibling) { @@ -277,8 +276,7 @@ Ox.$ = Ox.element = function(value) { e Event properties @*/ one: function(events) { - var args = Ox.slice(arguments), - that = this; + var args = Ox.slice(arguments), that = this; Ox.forEach(normalizeEvents(arguments), function(callback, event) { that.on(event, function fn() { that.off(event, fn); @@ -289,18 +287,17 @@ Ox.$ = Ox.element = function(value) { }, /*@ parent Returns the parent of this element - () -> Parent element + () -> Parent element @*/ parent: function() { return this[0].parentNode; }, /*@ parents Returns all ancestors of this element - () -> <[o]> Ancestor elements + () -> <[h]> Ancestor elements @*/ parents: function() { - var parent = this[0], - parents = []; + var parent = this[0], parents = []; while (true) { var parent = parent.parentNode; if (!parent) { @@ -334,18 +331,17 @@ Ox.$ = Ox.element = function(value) { }, /*@ prev Returns the sibling before this element - () -> Next element + () -> Next element @*/ prev: function() { return this[0].previousSibling; }, /*@ prevAll Returns all siblings before this element - () -> <[o]> Next elements + () -> <[h]> Next elements @*/ prevAll: function() { - var sibling = this[0], - siblings = []; + var sibling = this[0], siblings = []; while (true) { var sibling = sibling.previousSibling; if (!sibling) { @@ -391,13 +387,61 @@ Ox.$ = Ox.element = function(value) { return this; }, /*@ - show Show this element + replace Replaces another element with this element + (element) -> This element + element Another element + @*/ + replace: function($element) { + var next = $element[0].nextSibling, parent = $element[0].parentNode; + $element.remove(); + parent.insertBefore(this[0], next); + return this; + }, + /*@ + replaceWith Replaces this element with another element + (element) -> This element + element Another element + @*/ + replaceWith: function($element) { + var next = this[0].nextSibling, parent = this[0].parentNode; + this.remove(); + parent.insertBefore($element[0], next); + return this; + }, + /*@ + show Shows this element () -> This element @*/ show: function() { return this.css({display: 'block'}); }, /*@ + siblings Returns all siblings of this element + () -> <[oh]> Sibling elements + @*/ + siblings: function() { + var that = this; + return Ox.filter(this[0].parentNode.childNodes, function(element) { + return element !== that[0]; + }); + }, + /*@ + text Gets or sets the text contents + () -> The text contents + (text) -> This element + text The text contents + @*/ + text: function() { + var ret; + if (arguments.length == 0) { + ret = Ox.isString(this.textContent) + ? this.textContent : this.innerText; + } else { + ret = this.empty().append(this[0].createTextNode(string)); + } + return ret; + }, + /*@ toggleClass Toggles a class name (className) -> This element className Class name