').first()) // Same as document.createElement('div')
11 | .prepend(u('
').nodes)
12 | .prepend(function(){})
13 | .prepend(function(el){}, elements)
14 | .prepend(function(el){}, 10)
15 | ```
16 |
17 |
18 |
19 | ### Parameters
20 |
21 | `html = ""`:
22 | - Any of these elements:
23 | - **string** containing the html that is going to be inserted
24 | - **instance of Umbrella**
25 | - **HTML node**
26 | - **array** containing HTML nodes
27 | - A callback that returns any of the previous. It gets passed these parameters:
28 | - **el**: the current element from the elements parameter, {} if none is specified and i if elements is number
29 | - **i**: the index of the current element
30 |
31 | `elements = [{}]` (optional): It can be any of the following:
32 | - An array of elements that will be passed to the callback. The callback is executed once per element, and all of them are added consecutively.
33 | - A CSS selector, so the function will be executed once per matched element.
34 | - A number, in which case the function will be executed that number of times
35 |
36 |
37 |
38 | ### Return
39 |
40 | `u`: returns the same instance of Umbrella JS
41 |
42 |
43 |
44 | ### Examples
45 |
46 | Add a header to each of the articles
47 |
48 | ```js
49 | u("article").prepend("
");
50 | ```
51 |
52 | Add three elements at the beginning of the list. All of these methods are equivalent:
53 |
54 | ```js
55 | // Add them all like a single string
56 | u("ul").prepend("
OneTwoThree");
57 |
58 | // Add them in a chain
59 | u("ul").prepend("
Three").append("
Two").append("
One");
60 |
61 | // Add them with a function parameter
62 | var cb = function(txt){ return "
" + txt + "" };
63 | u("ul").prepend(cb, ["One", "Two", "Three"]);
64 |
65 | // Same as the previous one but with ES6
66 | u("ul").prepend(txt => `
${ txt }`, ["One", "Two", "Three"]);
67 | ```
68 |
69 | They all result in:
70 |
71 | ```html
72 |
73 | - One
74 | - Two
75 | - Three
76 |
77 |
78 |
79 | ```
80 |
81 | You can also add some events to them by creating an html node:
82 |
83 | ```js
84 | function greeting(){ alert("Hello world"); }
85 |
86 | u("a.main").prepend(function(){
87 | return u('
').addClass('hi').on('click', greeting).html("Greetings!");
88 | });
89 | ```
90 |
91 |
92 |
93 | ### Related
94 |
95 | [.append()](#append) Add some html as a child at the end of each of the matched elements
96 |
97 | [.before()](#before) Add some html before each of the matched elements.
98 |
99 | [.after()](#after) Add some html as a sibling after each of the matched elements.
100 |
--------------------------------------------------------------------------------
/src/plugins/prepend/test.js:
--------------------------------------------------------------------------------
1 | // Testing the main file
2 | describe(".prepend()", function() {
3 |
4 | // Default callback for the tests
5 | function callback(cl){
6 | return 'Link';
7 | }
8 |
9 | beforeEach(function(){
10 |
11 | // Just in case it stringifies the callback
12 | expect(base.html().match('function')).to.equal(null);
13 | expect(u('.bla, .blu').length).to.equal(0);
14 | });
15 |
16 | afterEach(function(){
17 | u('.bla, .blu').remove();
18 | });
19 |
20 | it("should be a function", function() {
21 | expect(typeof base.prepend).to.equal('function');
22 | });
23 |
24 | it("can add content in the right place", function() {
25 | base.prepend('
Link');
26 | size('.base > .bla', 1);
27 | });
28 |
29 | it("can add content with a callback", function() {
30 | base.prepend(callback);
31 | size('.base > .bla', 1)('.base > .bla:first-child', 1);
32 | });
33 |
34 | it("is called as many times as data in the second param", function() {
35 | base.prepend('
Link', ["a", "b"]);
36 | size('.base > .bla', 2)('.base > .bla:first-child', 1);
37 | });
38 |
39 | it("can add content inverted with a callback and data", function() {
40 | base.prepend(callback, ["a", "b"]);
41 | //throw "Error";
42 | size('.base > .bla', 2)('.base > .bla.a', 1)('.base > .bla.b', 1);
43 | size('.bla.a + .bla.b', 1)('.bla.b + .bla.a', 0)('.base > .bla.a:first-child', 1);
44 | });
45 |
46 | it("can generate some text", function(){
47 | var list = u("
");
48 | if (work) list.prepend (function(n){ return n + "\n" }, ['a', 'b']);
49 |
50 | expect(list.children().length).to.equal(0);
51 | expect(list.html()).to.equal('a\nb\n');
52 | });
53 | });
54 |
--------------------------------------------------------------------------------
/src/plugins/remove/readme.md:
--------------------------------------------------------------------------------
1 | ## .remove()
2 |
3 | Removes the matched elements.
4 |
5 | ```js
6 | .remove();
7 | ```
8 |
9 |
10 | ### Parameters
11 |
12 | This method doesn't accept any parameters
13 |
14 |
15 | ### Return
16 |
17 | `u`: Returns an instance of Umbrella JS with the removed nodes.
18 |
19 |
20 | ### Examples
21 |
22 | Remove all the elements of a list:
23 |
24 | ```js
25 | u("ul.demo li").remove();
26 | ```
27 |
--------------------------------------------------------------------------------
/src/plugins/remove/remove.js:
--------------------------------------------------------------------------------
1 | // Delete the matched nodes from the DOM
2 | u.prototype.remove = function () {
3 | // Loop through all the nodes
4 | return this.each(function (node) {
5 | // Perform the removal only if the node has a parent
6 | if (node.parentNode) {
7 | node.parentNode.removeChild(node);
8 | }
9 | });
10 | };
11 |
--------------------------------------------------------------------------------
/src/plugins/remove/test.js:
--------------------------------------------------------------------------------
1 | // Testing the main file
2 | describe(".remove()", function() {
3 |
4 | beforeEach(function() {
5 | base.append('\
6 |
\
10 | ');
11 |
12 | expect(u('.remove-test').length).to.equal(1);
13 | expect(u('.remove-test li').length).to.equal(2);
14 | });
15 |
16 | afterEach(function() {
17 | u('.remove-test').remove();
18 | });
19 |
20 |
21 | it("should be defined", function() {
22 | expect(typeof base.remove).to.equal('function');
23 | });
24 |
25 | it("can be called even without any node", function() {
26 | expect(u('.remove-test div').length).to.equal(0);
27 | u('.remove-test div').remove();
28 | });
29 |
30 | it("can be called even without parentNode", function() {
31 | var children = u('.remove-test li');
32 | children.remove();
33 | expect(children.first().parentNode).to.be.null;
34 | children.remove(); // Remove them again
35 | });
36 |
37 | it("should return an instance of umbrella with the removed nodes", function() {
38 | var result = u('.remove-test').remove();
39 |
40 | expect(result).to.be.instanceof(u);
41 | expect(result.nodes).to.have.length(1);
42 | expect(result.attr('class')).to.equal('remove-test');
43 | expect(result.children().nodes).to.have.length(2); // Two li children.
44 | });
45 |
46 | it("removes a single element", function() {
47 | u('.remove-test').remove();
48 | expect(u('.remove-test').length).to.equal(0);
49 | });
50 |
51 | it("removes several elements", function() {
52 | u('.remove-test li').remove();
53 | expect(u('.remove-test li').length).to.equal(0);
54 | });
55 | });
56 |
--------------------------------------------------------------------------------
/src/plugins/removeclass/readme.md:
--------------------------------------------------------------------------------
1 | ## .removeClass()
2 |
3 | Remove html class(es) to all of the matched elements.
4 |
5 | ```js
6 | .removeClass('name1');
7 | .removeClass('name1 name2 nameN');
8 | .removeClass('name1,name2,nameN');
9 | .removeClass('name1', 'name2', 'nameN');
10 | .removeClass(['name1', 'name2', 'nameN']);
11 | .removeClass(['name1', 'name2'], ['name3'], ['nameN']);
12 | .removeClass(function(){ return 'name1'; });
13 | .removeClass(function(){ return 'name1'; }, function(){ return 'name2'; });
14 | ```
15 |
16 |
17 | ### Parameters
18 |
19 | `name1`, `name2`, `nameN`: the class name (or variable containing it) to be removed to all of the matched elements. It accepts many different types of parameters (see above).
20 |
21 |
22 |
23 | ### Return
24 |
25 | `u`: returns the same instance of Umbrella JS
26 |
27 |
28 |
29 | ### Examples
30 |
31 | Remove the class `main` to all the `
` from the page:
32 |
33 | ```js
34 | u("h2").removeClass("main");
35 | ```
36 |
37 | Remove the class `toValidate` and `ajaxify` to all the `