Ox.$: add children, find, insertAfter, insertBefore, next, nextAll, parent, parents, prepend, prependTo, prev, and prevAll, fix attr and one
This commit is contained in:
rolux
parent
84bfd1222e
commit
d0aee8c737
1 changed files with 151 additions and 23 deletions
|
|
@ -48,24 +48,24 @@ Ox.$ = Ox.element = function(value) {
|
|||
return this;
|
||||
},
|
||||
/*@
|
||||
append <f> Appends another element to this element
|
||||
append <f> Appends one or more elements to this element
|
||||
(element) -> <o> This element
|
||||
element <o|[o]> One or more elements
|
||||
@*/
|
||||
append: function() {
|
||||
var that = this;
|
||||
Ox.makeArray(arguments[0]).forEach(function(element) {
|
||||
that[0].appendChild(element[0]);
|
||||
Ox.makeArray(arguments[0]).forEach(function($element) {
|
||||
that[0].appendChild($element[0]);
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
appendTo <f> appends this element object to another element object
|
||||
appendTo <f> Appends this element object to another element object
|
||||
(element) -> <o> This element
|
||||
element <o> Another element
|
||||
@*/
|
||||
appendTo: function(element) {
|
||||
element[0].appendChild(this[0]);
|
||||
appendTo: function($element) {
|
||||
$element[0].appendChild(this[0]);
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
|
|
@ -79,19 +79,29 @@ Ox.$ = Ox.element = function(value) {
|
|||
attr: function() {
|
||||
var ret, that = this;
|
||||
if (arguments.length == 1 && Ox.isString(arguments[0])) {
|
||||
ret = this[0].getAttribute(arguments[0]);
|
||||
ret = this[0].getAttribute
|
||||
? this[0].getAttribute(arguments[0])
|
||||
: null;
|
||||
// fixme: why exactly is this needed?
|
||||
if (ret === null) {
|
||||
ret = void 0;
|
||||
}
|
||||
} else {
|
||||
Ox.forEach(Ox.makeObject(arguments), function(value, key) {
|
||||
that[0].setAttribute(key, value);
|
||||
that[0].setAttribute && that[0].setAttribute(key, value);
|
||||
});
|
||||
ret = this;
|
||||
}
|
||||
return ret;
|
||||
},
|
||||
/*@
|
||||
children <f> Returns the children of this element
|
||||
() -> <[o]> Children
|
||||
@*/
|
||||
children: function() {
|
||||
return Ox.slice(this[0].childNodes);
|
||||
},
|
||||
/*@
|
||||
css <f> Gets or sets a CSS attribute
|
||||
(key) -> <s> Value
|
||||
(key, value) -> <o> This element
|
||||
|
|
@ -119,6 +129,14 @@ Ox.$ = Ox.element = function(value) {
|
|||
return this.html('');
|
||||
},
|
||||
/*@
|
||||
find <f> Find descendant elements
|
||||
([selector]) -> <a> Elements
|
||||
selector <s|'*'> CSS selector
|
||||
@*/
|
||||
find: function(string) {
|
||||
return Ox.slice(this[0].querySelectorAll(string || '*'));
|
||||
},
|
||||
/*@
|
||||
hasClass <f> Returns true if this element has a given class
|
||||
(className) -> <b> True if this element has the class
|
||||
className <s> Class name
|
||||
|
|
@ -157,6 +175,66 @@ Ox.$ = Ox.element = function(value) {
|
|||
return ret;
|
||||
},
|
||||
/*@
|
||||
insertAfter <f> Inserts this element after another element
|
||||
(element) -> <o> This element
|
||||
element <o> Another element
|
||||
@*/
|
||||
insertAfter: function($element) {
|
||||
$element[0].parentNode.insertBefore(this[0], $element[0].nextSibling);
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
insertBefore <f> Inserts this element before another element
|
||||
(element) -> <o> This element
|
||||
element <o> Another element
|
||||
@*/
|
||||
insertBefore: function($element) {
|
||||
$element[0].parentNode.insertBefore(this[0], $element[0]);
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
next <f> Returns the sibling after this element
|
||||
() -> <o> Next element
|
||||
@*/
|
||||
next: function() {
|
||||
return this[0].nextSibling;
|
||||
},
|
||||
/*@
|
||||
nextAll <f> Returns all siblings after this element
|
||||
() -> <[o]> Next elements
|
||||
@*/
|
||||
nextAll: function() {
|
||||
var sibling = this[0],
|
||||
siblings = [];
|
||||
while (true) {
|
||||
var sibling = sibling.nextSibling;
|
||||
if (!sibling) {
|
||||
break;
|
||||
}
|
||||
siblings.push(sibling);
|
||||
}
|
||||
return siblings;
|
||||
},
|
||||
/*@
|
||||
off <f> Unbinds a callback from an event
|
||||
(event) -> <o> This element (unbinds all callbacks)
|
||||
(event, callback) -> <o> This element
|
||||
({event0: callback0, event1: callback1, ...}) -> <o> This element
|
||||
event <s> Event name
|
||||
callback <f> Callback function
|
||||
@*/
|
||||
off: function(event, callback) {
|
||||
var that = this;
|
||||
Ox.forEach(Ox.makeObject(arguments), function(callback, event) {
|
||||
if (callback) {
|
||||
that[0].removeEventListener(event, callback, false);
|
||||
} else {
|
||||
that[0]['on' + event] = null;
|
||||
}
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
on <f> Binds a callback to an event
|
||||
(event, callback) -> <o> This element
|
||||
({event0: callback0, event1: callback1, ...}) -> <o> This element
|
||||
|
|
@ -180,35 +258,85 @@ Ox.$ = Ox.element = function(value) {
|
|||
e <o> Event properties
|
||||
@*/
|
||||
one: function(events) {
|
||||
var that = this;
|
||||
var args = Ox.slice(arguments),
|
||||
that = this;
|
||||
Ox.forEach(Ox.makeObject(arguments), function(callback, event) {
|
||||
that.on(event, function fn() {
|
||||
that.off(event, fn);
|
||||
callback();
|
||||
return callback.apply(that, args);
|
||||
});
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
off <f> Unbinds a callback from an event
|
||||
(event) -> <o> This element (unbinds all callbacks)
|
||||
(event, callback) -> <o> This element
|
||||
({event0: callback0, event1: callback1, ...}) -> <o> This element
|
||||
event <s> Event name
|
||||
callback <f> Callback function
|
||||
parent <f> Returns the parent of this element
|
||||
() -> <o> Parent element
|
||||
@*/
|
||||
off: function(event, callback) {
|
||||
var that = this;
|
||||
Ox.forEach(Ox.makeObject(arguments), function(callback, event) {
|
||||
if (callback) {
|
||||
that[0].removeEventListener(event, callback, false);
|
||||
} else {
|
||||
that[0]['on' + event] = null;
|
||||
parent: function() {
|
||||
return this[0].parentNode;
|
||||
},
|
||||
/*@
|
||||
parents <f> Returns all ancestors of this element
|
||||
() -> <[o]> Ancestor elements
|
||||
@*/
|
||||
parents: function() {
|
||||
var parent = this[0],
|
||||
parents = [];
|
||||
while (true) {
|
||||
var parent = parent.parentNode;
|
||||
if (!parent) {
|
||||
break;
|
||||
}
|
||||
parents.unshift(parent);
|
||||
}
|
||||
return parents;
|
||||
},
|
||||
/*@
|
||||
prepend <f> Prepends one or more elements to this element
|
||||
(element) -> <o> This element
|
||||
element <o|[o]> One or more elements
|
||||
@*/
|
||||
prepend: function() {
|
||||
var parent = this[0].parentNode;
|
||||
Ox.makeArray(arguments[0]).reverse().forEach(function($element) {
|
||||
parent.insertBefore($element[0], parent.firstChild);
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
prependTo <f> Prepends this element object to another element object
|
||||
(element) -> <o> This element
|
||||
element <o> Another element
|
||||
@*/
|
||||
prependTo: function($element) {
|
||||
var element = $element[0];
|
||||
element.insertBefore(this[0], element.firstChild);
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
prev <f> Returns the sibling before this element
|
||||
() -> <o> Next element
|
||||
@*/
|
||||
prev: function() {
|
||||
return this[0].previousSibling;
|
||||
},
|
||||
/*@
|
||||
prevAll <f> Returns all siblings before this element
|
||||
() -> <[o]> Next elements
|
||||
@*/
|
||||
prevAll: function() {
|
||||
var sibling = this[0],
|
||||
siblings = [];
|
||||
while (true) {
|
||||
var sibling = sibling.previousSibling;
|
||||
if (!sibling) {
|
||||
break;
|
||||
}
|
||||
siblings.unshift(sibling);
|
||||
}
|
||||
return siblings;
|
||||
},
|
||||
/*@
|
||||
remove <f> Removes this element from the DOM
|
||||
() -> <o> This element
|
||||
@*/
|
||||
|
|
|
|||
Loading…
Reference in a new issue