tagu-tagu 3.2.5 → 3.2.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +25 -27
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -41,9 +41,6 @@ document.body.appendChild(CounterExample());
|
|
|
41
41
|
No need to compile. But typescript is supported.
|
|
42
42
|
|
|
43
43
|
## Examples
|
|
44
|
-
See examples [here](https://dothesimplest.github.io/tagu-tagu/).
|
|
45
|
-
|
|
46
|
-
## Features
|
|
47
44
|
|
|
48
45
|
### Initializers
|
|
49
46
|
`tagu-tagu` uses rest parameters. Arguments can be any order.
|
|
@@ -52,26 +49,6 @@ button("Hello!", {css: {background: "blue"}});
|
|
|
52
49
|
button({css: {background: "blue"}}, "Hello!");
|
|
53
50
|
```
|
|
54
51
|
|
|
55
|
-
#### Modify existing element
|
|
56
|
-
You can use initializers for existing element.
|
|
57
|
-
[JSFiddle](https://jsfiddle.net/do_the_simplest/o87nw6zL/15/)
|
|
58
|
-
|
|
59
|
-
```typescript
|
|
60
|
-
import { Modify } from "tagu-tagu";
|
|
61
|
-
|
|
62
|
-
Modify(document.body, {
|
|
63
|
-
text: "💣",
|
|
64
|
-
css: {
|
|
65
|
-
background: "skyblue",
|
|
66
|
-
},
|
|
67
|
-
on: {
|
|
68
|
-
click: () => {
|
|
69
|
-
document.body.textContent = "💥";
|
|
70
|
-
},
|
|
71
|
-
},
|
|
72
|
-
});
|
|
73
|
-
|
|
74
|
-
```
|
|
75
52
|
|
|
76
53
|
#### `html` initializer
|
|
77
54
|
[JSFiddle](https://jsfiddle.net/do_the_simplest/6p9jh45L/2/)
|
|
@@ -120,19 +97,19 @@ document.body.appendChild(AttrExample());
|
|
|
120
97
|
```
|
|
121
98
|
|
|
122
99
|
#### `prop` initializer
|
|
123
|
-
[JSFiddle](https://jsfiddle.net/do_the_simplest/mc38ksqw/
|
|
100
|
+
[JSFiddle](https://jsfiddle.net/do_the_simplest/mc38ksqw/2/)
|
|
124
101
|
|
|
125
102
|
```typescript
|
|
126
103
|
import { option, select } from "tagu-tagu";
|
|
127
104
|
|
|
128
|
-
//
|
|
129
|
-
function
|
|
105
|
+
// Javascript properties
|
|
106
|
+
function PropExample() {
|
|
130
107
|
return select([option("One"), option("Two"), option("Three")], {
|
|
131
108
|
prop: { selectedIndex: 1 },
|
|
132
109
|
});
|
|
133
110
|
}
|
|
134
111
|
|
|
135
|
-
document.body.appendChild(
|
|
112
|
+
document.body.appendChild(PropExample());
|
|
136
113
|
```
|
|
137
114
|
|
|
138
115
|
#### `on` initializer
|
|
@@ -148,6 +125,27 @@ function OnExample() {
|
|
|
148
125
|
document.body.appendChild(OnExample());
|
|
149
126
|
```
|
|
150
127
|
|
|
128
|
+
#### Modify existing element
|
|
129
|
+
You can use initializers for existing element.
|
|
130
|
+
[JSFiddle](https://jsfiddle.net/do_the_simplest/o87nw6zL/15/)
|
|
131
|
+
|
|
132
|
+
```typescript
|
|
133
|
+
import { Modify } from "tagu-tagu";
|
|
134
|
+
|
|
135
|
+
Modify(document.body, {
|
|
136
|
+
text: "💣",
|
|
137
|
+
css: {
|
|
138
|
+
background: "skyblue",
|
|
139
|
+
},
|
|
140
|
+
on: {
|
|
141
|
+
click: () => {
|
|
142
|
+
document.body.textContent = "💥";
|
|
143
|
+
},
|
|
144
|
+
},
|
|
145
|
+
});
|
|
146
|
+
|
|
147
|
+
```
|
|
148
|
+
|
|
151
149
|
#### `$` initializer
|
|
152
150
|
[JSFiddle](https://jsfiddle.net/do_the_simplest/b8roj7wx/1/)
|
|
153
151
|
```html
|