als-document 1.0.0-beta → 1.0.0
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/document.js +2 -2
- package/index.js +2 -2
- package/index.mjs +2 -2
- package/package.json +1 -1
- package/src/node/node.js +7 -4
- package/src/query/query.js +12 -6
- package/tests/index.html +1 -1
package/document.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
const alsDocument = (function(){
|
|
2
|
-
class Query{
|
|
3
2
|
static get(query){
|
|
4
3
|
let q=new Query(query)
|
|
5
4
|
return q.selectors
|
|
6
5
|
}
|
|
7
6
|
constructor(query){
|
|
8
7
|
this.query=query
|
|
9
8
|
this.selectors=[]
|
|
10
9
|
this.stringValues=[];
|
|
11
10
|
this.parseSelectors(query.split(','))
|
|
12
11
|
}
|
|
13
12
|
parseSelectors(selectors){
|
|
14
13
|
selectors.forEach(selector=>{
|
|
15
14
|
let originalSelector=selector.trim()
|
|
16
15
|
selector=this.removeSpaces(selector)
|
|
17
16
|
this.stringValues=[]
|
|
18
17
|
selector=selector.replace(/\[.*?\]/g,(value)=>{
|
|
19
18
|
this.stringValues.push(value)
|
|
20
19
|
return `[${this.stringValues.length-1}]`
|
|
21
20
|
})
|
|
22
21
|
let [element,ancestors]=this.splitAndCutLast(selector,' ')
|
|
23
22
|
element=this.getFamily(element)
|
|
24
23
|
if (ancestors.length>0)
|
|
25
24
|
element.ancestors=ancestors.map(ancestor=>this.getFamily(ancestor))
|
|
26
25
|
element.group=originalSelector
|
|
27
26
|
this.selectors.push(element)
|
|
28
27
|
});
|
|
29
28
|
}
|
|
30
29
|
splitAndCutLast(string,splitBy){
|
|
31
30
|
const array=string.split(splitBy);
|
|
32
31
|
const last=array.pop();
|
|
33
32
|
return [last,array];
|
|
34
33
|
}
|
|
35
34
|
getFamily(group,element,prev,prevAny,sign){
|
|
36
35
|
if (group.match(/\~|\+/)!==null){
|
|
37
36
|
let [last,prevBrothers]=this.splitAndCutLast(group,/\~|\+/)
|
|
38
37
|
let signs=group.replace(last,'')
|
|
39
38
|
prevBrothers.forEach(el=>signs=signs.replace(el,''))
|
|
40
39
|
signs=signs.match(/\~|\+/g)
|
|
41
40
|
if (signs.length==1){
|
|
42
41
|
sign=signs[0]
|
|
43
42
|
} else if (signs.length>1){
|
|
44
43
|
sign=signs.splice(signs.length-1,signs.length-1)[0]
|
|
45
44
|
prevBrothers[0]=prevBrothers.map((b,i)=>{
|
|
46
45
|
if (i< prevBrothers.length-1) b+=signs[i]
|
|
47
46
|
return b
|
|
48
47
|
}).join('')
|
|
49
48
|
prevBrothers[0]=this.getFamily(prevBrothers[0])
|
|
50
49
|
}
|
|
51
50
|
if (sign=='~') prevAny=prevBrothers[0]
|
|
52
51
|
else if (sign=='+') prev=prevBrothers[0]
|
|
53
52
|
element=last
|
|
54
53
|
} else element=group
|
|
55
54
|
let family
|
|
56
55
|
if (prev || prevAny){
|
|
57
56
|
family=this.getParents(element)
|
|
58
57
|
if (prev) family.prev=this.getParents(prev)
|
|
59
58
|
if (prevAny) family.prevAny=this.getParents(prevAny)
|
|
60
59
|
} else family=this.getParents(element)
|
|
61
60
|
if (family.query!==group) family.group=group
|
|
62
61
|
return family
|
|
63
62
|
}
|
|
64
63
|
getParents(selector){
|
|
65
64
|
if (typeof selector=='string'){
|
|
66
65
|
let [element,parents]=this.splitAndCutLast(selector,'>')
|
|
67
66
|
element=this.buildElement(element)
|
|
68
67
|
parents=parents.map(parent=>this.buildElement(parent))
|
|
69
68
|
if (parents.length>0) element.parents=parents
|
|
70
69
|
return element
|
|
71
70
|
} else return selector
|
|
72
71
|
}
|
|
73
72
|
buildElement(element,id=null,tag=null,classList=[]){
|
|
74
73
|
let query=element
|
|
75
74
|
element=element.replace(/\#(\w-?)*/,$id=>{
|
|
76
75
|
id=$id.replace(/^\#/,''); return ''
|
|
77
76
|
})
|
|
78
77
|
element=element.replace(/\.(\w-?)*/,$class=>{
|
|
79
78
|
classList.push($class.replace(/^\./,'')); return ''
|
|
80
79
|
})
|
|
81
80
|
element=element.replace(/(\w\:?-?)*/,$tag=>{
|
|
82
81
|
tag=$tag=='' ? null : $tag; return ''
|
|
83
82
|
})
|
|
84
83
|
let attribs=this.getAttributes(element)
|
|
85
84
|
element={ query }
|
|
86
85
|
if (id) element.id=id
|
|
87
86
|
if (tag) element.tag=tag
|
|
88
87
|
if (classList.length>0) element.classList=classList
|
|
89
88
|
if (attribs.length>0) element.attribs=attribs
|
|
90
89
|
return element
|
|
91
90
|
}
|
|
92
91
|
getAttributes(element){
|
|
93
92
|
let attribs=this.stringValues.filter((value,index)=>{
|
|
94
93
|
let searchValue=`[${index}]`
|
|
95
94
|
if (element.match(searchValue)) return true
|
|
96
95
|
else return false
|
|
97
96
|
})
|
|
98
97
|
attribs=attribs.map(attrib=>{
|
|
99
98
|
let query=attrib
|
|
100
99
|
attrib=attrib.replace('[','').replace(']','')
|
|
101
100
|
let [name,value]=attrib.split(/[\~\|\^\$\*]?\=/)
|
|
102
101
|
let sign=attrib.replace(name,'').replace(value,'')
|
|
103
102
|
attrib={ query }
|
|
104
103
|
if (name) attrib.name=name
|
|
105
104
|
if (value) attrib.value=value.trim().replace(/^\"/,'').replace(/\"$/,'')
|
|
106
105
|
if (sign){
|
|
107
106
|
attrib.sign=sign
|
|
108
107
|
attrib.check=this.getAttribFn(sign).bind(attrib)
|
|
109
108
|
}
|
|
110
109
|
return attrib
|
|
111
110
|
});
|
|
112
111
|
return attribs
|
|
113
112
|
}
|
|
114
113
|
getAttribFn(sign){
|
|
115
114
|
if (sign=='=') return function (value){ return value===this.value }
|
|
116
115
|
if (sign=='*=') return function (value){ return value.includes(this.value) }
|
|
117
116
|
if (sign=='^=') return function (value){ return value.startsWith(this.value) }
|
|
118
117
|
if (sign=='$=') return function (value){ return value.endsWith(this.value) }
|
|
119
118
|
if (sign=='|=') return function (value){
|
|
120
119
|
return value.trim().split(' ').length==1
|
|
121
120
|
&& (value.startsWith(this.value) || value.startsWith(this.value+'-'))
|
|
122
121
|
? true : false
|
|
123
122
|
}
|
|
124
123
|
if (sign=='~=') return function (value){
|
|
125
124
|
return this.value.trim().split(' ').length==1 && value.includes(this.value) ? true : false
|
|
126
125
|
}
|
|
127
126
|
}
|
|
128
127
|
removeSpaces(selector){
|
|
129
128
|
selector=selector.replace(/\s{2}/g,' ')
|
|
130
129
|
selector=selector.replace(/\s?\^?\$?\|?\~?\*?\=\s*/g,(m)=>m.trim())
|
|
131
130
|
selector=selector.replace(/\s?(\+|\~|\>)\s?/g,(m)=>m.trim())
|
|
132
131
|
return selector
|
|
133
132
|
}
|
|
133
|
+
class Query{
|
|
134
134
|
static get(query){
|
|
135
135
|
let q=new Query(query)
|
|
136
136
|
return q.selectors
|
|
137
137
|
}
|
|
138
138
|
constructor(query){
|
|
139
139
|
this.query=query
|
|
140
140
|
this.selectors=[]
|
|
141
141
|
this.stringValues=[];
|
|
142
142
|
this.parseSelectors(query.split(','))
|
|
143
143
|
}
|
|
144
144
|
parseSelectors(selectors){
|
|
145
145
|
selectors.forEach(selector=>{
|
|
146
146
|
let originalSelector=selector.trim()
|
|
147
147
|
selector=this.removeSpaces(selector)
|
|
148
148
|
this.stringValues=[]
|
|
149
149
|
selector=selector.replace(/\[.*?\]/g,(value)=>{
|
|
150
150
|
this.stringValues.push(value)
|
|
151
151
|
return `[${this.stringValues.length-1}]`
|
|
152
152
|
})
|
|
153
153
|
let [element,ancestors]=this.splitAndCutLast(selector,' ')
|
|
154
154
|
element=this.getFamily(element)
|
|
155
155
|
if (ancestors.length>0)
|
|
156
156
|
element.ancestors=ancestors.map(ancestor=>this.getFamily(ancestor))
|
|
157
157
|
element.group=originalSelector
|
|
158
158
|
this.selectors.push(element)
|
|
159
159
|
});
|
|
160
160
|
}
|
|
161
161
|
splitAndCutLast(string,splitBy){
|
|
162
162
|
const array=string.split(splitBy);
|
|
163
163
|
const last=array.pop();
|
|
164
164
|
return [last,array];
|
|
165
165
|
}
|
|
166
166
|
getFamily(group,element,prev,prevAny,sign){
|
|
167
167
|
if (group.match(/\~|\+/)!==null){
|
|
168
168
|
let [last,prevBrothers]=this.splitAndCutLast(group,/\~|\+/)
|
|
169
169
|
let signs=group.replace(last,'')
|
|
170
170
|
prevBrothers.forEach(el=>signs=signs.replace(el,''))
|
|
171
171
|
signs=signs.match(/\~|\+/g)
|
|
172
172
|
if (signs.length==1){
|
|
173
173
|
sign=signs[0]
|
|
174
174
|
} else if (signs.length>1){
|
|
175
175
|
sign=signs.splice(signs.length-1,signs.length-1)[0]
|
|
176
176
|
prevBrothers[0]=prevBrothers.map((b,i)=>{
|
|
177
177
|
if (i< prevBrothers.length-1) b+=signs[i]
|
|
178
178
|
return b
|
|
179
179
|
}).join('')
|
|
180
180
|
prevBrothers[0]=this.getFamily(prevBrothers[0])
|
|
181
181
|
}
|
|
182
182
|
if (sign=='~') prevAny=prevBrothers[0]
|
|
183
183
|
else if (sign=='+') prev=prevBrothers[0]
|
|
184
184
|
element=last
|
|
185
185
|
} else element=group
|
|
186
186
|
let family
|
|
187
187
|
if (prev || prevAny){
|
|
188
188
|
family=this.getParents(element)
|
|
189
189
|
if (prev) family.prev=this.getParents(prev)
|
|
190
190
|
if (prevAny) family.prevAny=this.getParents(prevAny)
|
|
191
191
|
} else family=this.getParents(element)
|
|
192
192
|
if (family.query!==group) family.group=group
|
|
193
193
|
return family
|
|
194
194
|
}
|
|
195
195
|
getParents(selector){
|
|
196
196
|
if (typeof selector=='string'){
|
|
197
197
|
let [element,parents]=this.splitAndCutLast(selector,'>')
|
|
198
198
|
element=this.buildElement(element)
|
|
199
199
|
parents=parents.map(parent=>this.buildElement(parent))
|
|
200
200
|
if (parents.length>0) element.parents=parents
|
|
201
201
|
return element
|
|
202
202
|
} else return selector
|
|
203
203
|
}
|
|
204
204
|
buildElement(element,id=null,tag=null,classList=[]){
|
|
205
205
|
let query=element
|
|
206
206
|
element=element.replace(/\#(\w-?)*/,$id=>{
|
|
207
207
|
id=$id.replace(/^\#/,''); return ''
|
|
208
208
|
})
|
|
209
209
|
element=element.replace(/\.(\w-?)*/,$class=>{
|
|
210
210
|
classList.push($class.replace(/^\./,'')); return ''
|
|
211
211
|
})
|
|
212
212
|
element=element.replace(/(\w\:?-?)*/,$tag=>{
|
|
213
213
|
tag=$tag=='' ? null : $tag; return ''
|
|
214
214
|
})
|
|
215
215
|
let attribs=this.getAttributes(element)
|
|
216
216
|
element={ query }
|
|
217
217
|
if (id) element.id=id
|
|
218
218
|
if (tag) element.tag=tag
|
|
219
219
|
if (classList.length>0) element.classList=classList
|
|
220
220
|
if (attribs.length>0) element.attribs=attribs
|
|
221
221
|
return element
|
|
222
222
|
}
|
|
223
223
|
getAttributes(element){
|
|
224
224
|
let attribs=this.stringValues.filter((value,index)=>{
|
|
225
225
|
let searchValue=`[${index}]`
|
|
226
226
|
if (element.match(searchValue)) return true
|
|
227
227
|
else return false
|
|
228
228
|
})
|
|
229
229
|
attribs=attribs.map(attrib=>{
|
|
230
230
|
let query=attrib
|
|
231
231
|
attrib=attrib.replace('[','').replace(']','')
|
|
232
232
|
let [name,...values]=attrib.split('=')
|
|
233
233
|
const value=values.join('=').trim().replace(/^\"/,'').replace(/\"$/,'')
|
|
234
234
|
let sign
|
|
235
235
|
if(value){
|
|
236
236
|
sign='='
|
|
237
237
|
name=name.replace(/[\~\|\^\$\*]$/,(match=>{
|
|
238
238
|
sign=match+sign
|
|
239
239
|
return ''
|
|
240
240
|
}))
|
|
241
241
|
}
|
|
242
242
|
attrib={query,name,value}
|
|
243
243
|
if (sign){
|
|
244
244
|
attrib.sign=sign
|
|
245
245
|
attrib.check=this.getAttribFn(sign).bind(attrib)
|
|
246
246
|
}
|
|
247
247
|
return attrib
|
|
248
248
|
});
|
|
249
249
|
return attribs
|
|
250
250
|
}
|
|
251
251
|
getAttribFn(sign){
|
|
252
252
|
if (sign=='=') return function (value){ return value===this.value }
|
|
253
253
|
if (sign=='*=') return function (value){ return value.includes(this.value) }
|
|
254
254
|
if (sign=='^=') return function (value){ return value.startsWith(this.value) }
|
|
255
255
|
if (sign=='$=') return function (value){ return value.endsWith(this.value) }
|
|
256
256
|
if (sign=='|=') return function (value){
|
|
257
257
|
return value.trim().split(' ').length==1
|
|
258
258
|
&& (value.startsWith(this.value) || value.startsWith(this.value+'-'))
|
|
259
259
|
? true : false
|
|
260
260
|
}
|
|
261
261
|
if (sign=='~=') return function (value){
|
|
262
262
|
return this.value.trim().split(' ').length==1 && value.includes(this.value) ? true : false
|
|
263
263
|
}
|
|
264
264
|
}
|
|
265
265
|
removeSpaces(selector){
|
|
266
266
|
selector=selector.replace(/\s{2}/g,' ')
|
|
267
267
|
selector=selector.replace(/\s?\^?\$?\|?\~?\*?\=\s*/g,(m)=>m.trim())
|
|
268
268
|
selector=selector.replace(/\s?(\+|\~|\>)\s?/g,(m)=>m.trim())
|
|
269
269
|
return selector
|
|
270
270
|
}
|
|
271
271
|
}
|
|
272
272
|
function checkElement(el,selector){
|
|
273
273
|
if(selector==undefined) return true
|
|
274
274
|
if(el==null) return false
|
|
275
275
|
let{tag,classList,attribs:attributes,id,prev,ancestors,parents,prevAny}=selector
|
|
276
276
|
if(typeof el==='string') return false
|
|
277
277
|
if(id!==undefined && el.id===null) return false
|
|
278
278
|
if(id && id!==el.id) return false
|
|
279
279
|
if(tag && el.tagName===undefined) return false
|
|
280
280
|
else if(tag && tag!==el.tagName) return false
|
|
281
281
|
const clas=el.attributes.class
|
|
282
282
|
if(classList!==undefined && (clas===undefined || clas==='')) return false
|
|
283
283
|
else if(classList!==undefined){
|
|
284
284
|
if(classList.every(e=>el.classList.contains(e))===false) return false
|
|
285
285
|
}
|
|
286
286
|
if(checkattributes(attributes,el)===false) return false
|
|
287
287
|
if(checkElement(el.prev,prev)===false) return false
|
|
288
288
|
if(checkAncestors(el.ancestors,ancestors)===false) return false
|
|
289
289
|
if(checkParents(el.ancestors,parents)===false) return false
|
|
290
290
|
if(el.parent){
|
|
291
291
|
if(checkPrevAny(el.parent.children,el.childIndex,prevAny)==false) return false
|
|
292
292
|
}
|
|
293
293
|
return true
|
|
294
294
|
}
|
|
295
295
|
function checkattributes(attributes=[],el){
|
|
296
296
|
let elattributes=el.attributes
|
|
297
297
|
let names=Object.keys(elattributes)
|
|
298
298
|
let passedTests=0
|
|
299
299
|
if(attributes) for(let i=0; i<attributes.length; i++){
|
|
300
300
|
let{name,value,check}=attributes[i]
|
|
301
301
|
if(name=='inner' && value!==undefined && check && el.inner){
|
|
302
302
|
if(check(el.inner)) passedTests++
|
|
303
303
|
}
|
|
304
304
|
if(!names.includes(name)) continue
|
|
305
305
|
else if(value==undefined) passedTests++
|
|
306
306
|
else if(value && elattributes[name]){
|
|
307
307
|
if(check(elattributes[name])==false) continue
|
|
308
308
|
else passedTests++
|
|
309
309
|
}
|
|
310
310
|
}
|
|
311
311
|
if(passedTests==attributes.length) return true
|
|
312
312
|
else return false
|
|
@@ -22,7 +22,7 @@ function buildStyle(attributes){
|
|
|
22
22
|
const styles=attributes.style || "";
|
|
23
23
|
con
|
|
24
24
|
class NodeClassList{
|
|
25
25
|
constructor(node){ this.node=node }
|
|
26
26
|
get classes(){ return (this.node.attributes.class || "").split(" ").filter(Boolean) }
|
|
27
27
|
set classes(val){ this.node.attributes.class=val.join(" ") }
|
|
28
28
|
contains(className){ return this.classes.includes(className) }
|
|
29
29
|
add(className){
|
|
30
30
|
const currentClasses=this.classes;
|
|
31
31
|
if (!currentClasses.includes(className)) this.classes=[...currentClasses,className];
|
|
32
32
|
}
|
|
33
33
|
remove(className){ this.classes=this.classes.filter(cls=>cls!==className); }
|
|
34
34
|
toggle(className){
|
|
35
35
|
if (this.classes.includes(className)) this.remove(className);
|
|
36
36
|
else this.add(className);
|
|
37
37
|
}
|
|
38
38
|
replace(oldClass,newClass){
|
|
39
39
|
if (this.classes.includes(oldClass)){
|
|
40
40
|
this.remove(oldClass);
|
|
41
41
|
this.add(newClass);
|
|
42
42
|
}
|
|
43
43
|
}
|
|
44
44
|
}
|
|
45
45
|
function insertBefore(arr,index,newItem){
|
|
46
46
|
const existingIndex=arr.indexOf(newItem);
|
|
47
47
|
if (existingIndex!==-1) arr.splice(existingIndex,1);
|
|
48
48
|
arr.splice(index,0,newItem);
|
|
49
|
-
}
|
|
50
49
|
class Node{
|
|
51
50
|
constructor(tagName,attributes={},parent=null){
|
|
52
51
|
this.isSingle=false;
|
|
53
52
|
this.tagName=tagName;
|
|
54
53
|
this.attributes=attributes;
|
|
55
54
|
this.childNodes=[];
|
|
56
55
|
if (parent!==null) parent.childNodes.push(this)
|
|
57
56
|
this.parent=parent;
|
|
58
57
|
this._classList=null;
|
|
59
58
|
this.__style=null;
|
|
60
59
|
this._dataset=null
|
|
61
60
|
}
|
|
62
61
|
get id(){ return this.attributes.id ? this.attributes.id : null; }
|
|
63
62
|
set id(newValue){ this.attributes.id=newValue; }
|
|
64
63
|
get className(){return this.attributes.class || null}
|
|
65
64
|
get parentNode(){ return this.parent }
|
|
66
65
|
get ancestors(){
|
|
67
66
|
if(!this.parent) return []
|
|
68
67
|
const ancestors=[]
|
|
69
68
|
let element=this.parent
|
|
70
69
|
while (element.tagName!=='ROOT'){
|
|
71
70
|
ancestors.push(element)
|
|
72
71
|
element=element.parent
|
|
73
72
|
}
|
|
74
73
|
return ancestors.reverse()
|
|
75
74
|
}
|
|
76
75
|
get childNodeIndex(){
|
|
77
76
|
if(!this.parent) return null
|
|
78
77
|
return this.parent.childNodes ? this.parent.childNodes.indexOf(this) : null
|
|
79
78
|
}
|
|
80
79
|
get childIndex(){
|
|
81
80
|
if(!this.parent) return null
|
|
82
81
|
return this.parent.children ? this.parent.children.indexOf(this) : null
|
|
83
82
|
}
|
|
84
83
|
get previousElementSibling(){ return this.prev }
|
|
85
84
|
get prev(){
|
|
86
85
|
if (!this.childIndex) return null
|
|
87
86
|
return this.parent.children[this.childIndex-1]
|
|
88
87
|
}
|
|
89
88
|
get nextElementSibling(){ return this.next }
|
|
90
89
|
get next(){
|
|
91
90
|
if (!this.childIndex) return null
|
|
92
91
|
return this.parent.children[this.childIndex+1] || null
|
|
93
92
|
}
|
|
94
93
|
get dataset(){
|
|
95
94
|
if (!this._dataset) this._dataset=getDataset(this);
|
|
96
95
|
return this._dataset;
|
|
97
96
|
}
|
|
98
97
|
get classList(){
|
|
99
98
|
if (!this._classList) this._classList=new NodeClassList(this);
|
|
100
99
|
return this._classList;
|
|
101
100
|
}
|
|
102
101
|
get style(){
|
|
103
102
|
if (!this.__style) this.__style=buildStyle(this.attributes)
|
|
104
103
|
return this.__style
|
|
105
104
|
}
|
|
106
105
|
get outerHTML(){
|
|
107
106
|
const attrs=Object.entries(this.attributes).map(([key,val])=>val.length ? `${key}="${val}"` : key).join(" ");
|
|
108
107
|
return `<${this.tagName}${attrs ? ' '+attrs : ''}>${this.innerHTML}</${this.tagName}>`;
|
|
109
108
|
}
|
|
110
109
|
getAttribute(attrName){ return this.attributes[attrName] || null }
|
|
111
110
|
setAttribute(attrName,value){ this.attributes[attrName]=value }
|
|
112
111
|
removeAttribute(attrName){ delete this.attributes[attrName] }
|
|
113
112
|
remove(){
|
|
114
113
|
if (!this.parent) return
|
|
115
114
|
const index=this.childNodeIndex;
|
|
116
115
|
if (index!==null) this.parent.childNodes.splice(index,1);
|
|
117
116
|
}
|
|
118
117
|
get innerHTML(){
|
|
119
118
|
return this.childNodes.map(child=>{
|
|
120
119
|
if (child instanceof Node || child instanceof SingleNode) return child.outerHTML;
|
|
121
120
|
else if (child instanceof TextNode) return child.textContent;
|
|
122
121
|
else return child
|
|
123
122
|
}).join("");
|
|
124
123
|
}
|
|
125
124
|
$$(query){return this.querySelectorAll(query)}
|
|
126
125
|
querySelectorAll(query){
|
|
127
126
|
const selectors=Query.get(query)
|
|
128
127
|
return find(selectors,this,new Set())
|
|
129
128
|
}
|
|
130
129
|
$(query){return this.querySelector(query)}
|
|
131
130
|
querySelector(query){
|
|
132
131
|
const selectors=Query.get(query)
|
|
133
132
|
return find(selectors,this,new Set(),true)[0] || null
|
|
134
133
|
}
|
|
135
134
|
getElementsByClassName(query){ return this.querySelectorAll('.'+query) }
|
|
136
135
|
getElementsByTagName(query){ return this.querySelectorAll(query) }
|
|
137
136
|
getElementById(query){ return this.querySelector('#'+query) }
|
|
138
137
|
get children(){
|
|
139
138
|
return this.childNodes.filter(child=>{
|
|
140
139
|
if (!(child instanceof Node)) return false
|
|
141
140
|
if (child.tagName==='#comment') return false
|
|
142
141
|
return true
|
|
143
142
|
});
|
|
144
143
|
}
|
|
145
144
|
insertAdjacentElement(position,newElement){
|
|
146
145
|
if(newElement.tagName==='ROOT' && newElement.childNodes.length>0) newElement=newElement.childNodes[0]
|
|
147
146
|
const pos=position.toLowerCase();
|
|
148
147
|
if (pos==="afterbegin") this.childNodes.unshift(newElement);
|
|
149
148
|
else if (pos==="beforeend") this.childNodes.push(newElement);
|
|
150
149
|
newElement.parent=this
|
|
151
150
|
if (!this.parent) return newElement
|
|
152
151
|
if (pos==="beforebegin") insertBefore(this.parent.childNodes,this.childNodeIndex,newElement)
|
|
153
152
|
else if (pos==="afterend") this.parent.childNodes.splice(this.childNodeIndex+1,0,newElement);
|
|
154
153
|
newElement.parent=this.parent
|
|
155
154
|
return newElement
|
|
156
155
|
}
|
|
157
156
|
insertAdjacentHTML(position,html){
|
|
158
157
|
const newNode=parseHTML(html);
|
|
159
158
|
newNode.childNodes.reverse().forEach(node=>{
|
|
160
159
|
this.insertAdjacentElement(position,node);
|
|
161
160
|
});
|
|
162
161
|
return newNode
|
|
163
162
|
}
|
|
164
163
|
insertAdjacentText(position,text){
|
|
165
164
|
return this.insertAdjacentElement(position,new TextNode(text));
|
|
166
165
|
}
|
|
167
166
|
insert(position,element){
|
|
168
167
|
const positions=['beforebegin','afterbegin','beforeend','afterend']
|
|
169
168
|
if(positions[position]) position=positions[position]
|
|
170
169
|
if(typeof element==='string'){
|
|
171
170
|
element=element.trim()
|
|
172
171
|
if(element.startsWith('<') && element.endsWith('>')){
|
|
173
172
|
return this.insertAdjacentHTML(position,element)
|
|
174
173
|
}
|
|
175
174
|
return this.insertAdjacentText(position,element)
|
|
176
175
|
}
|
|
177
176
|
return this.insertAdjacentElement(position,element)
|
|
178
177
|
}
|
|
179
178
|
set innerHTML(html){
|
|
180
179
|
const parsed=parseHTML(html);
|
|
181
180
|
this.childNodes=parsed.childNodes;
|
|
182
181
|
}
|
|
183
182
|
set outerHTML(html){
|
|
184
183
|
const parsed=parseHTML(html);
|
|
185
184
|
if (!this.parent) return console.log('element has no parent node')
|
|
186
185
|
const index=this.childIndex
|
|
187
186
|
if (index!==null) this.parent.childNodes.splice(index,1,...parsed.childNodes);
|
|
188
187
|
}
|
|
189
188
|
appendChild(newChild){
|
|
190
189
|
if (newChild instanceof Node || newChild instanceof TextNode || newChild instanceof SingleNode){
|
|
191
190
|
if (newChild.parent) newChild.parent.childNodes=newChild.parent.childNodes.filter(child=>child!==newChild);
|
|
192
191
|
} else if(typeof newChild==='string') newChild=new TextNode(newChild)
|
|
193
192
|
else return newChild
|
|
194
193
|
this.childNodes.push(newChild);
|
|
195
194
|
newChild.parent=this;
|
|
196
195
|
return newChild;
|
|
197
196
|
}
|
|
198
197
|
get textContent(){
|
|
199
198
|
if (this.childNodes.length===0) return this.nodeName==='#text' ? this.nodeValue : '';
|
|
200
199
|
return this.childNodes.map(child=>{
|
|
201
200
|
if(child instanceof SingleNode) return ''
|
|
202
201
|
if(child instanceof TextNode) return child.nodeValue
|
|
203
202
|
if(child instanceof Node) return child.textContent;
|
|
204
203
|
else return child;
|
|
205
204
|
}).join(" ");
|
|
206
205
|
}
|
|
207
206
|
set textContent(value){
|
|
208
207
|
this.childNodes=[];
|
|
209
208
|
if (value!==null && value!==undefined){
|
|
210
209
|
this.childNodes.push(value.toString());
|
|
211
210
|
}
|
|
212
211
|
}
|
|
212
|
+
}
|
|
213
213
|
class Node{
|
|
214
214
|
constructor(tagName,attributes={},parent=null){
|
|
215
215
|
this.isSingle=false;
|
|
216
216
|
this.tagName=tagName;
|
|
217
217
|
this.attributes=attributes;
|
|
218
218
|
this.childNodes=[];
|
|
219
219
|
if (parent!==null) parent.childNodes.push(this)
|
|
220
220
|
this.parent=parent;
|
|
221
221
|
this._classList=null;
|
|
222
222
|
this.__style=null;
|
|
223
223
|
this._dataset=null
|
|
224
224
|
}
|
|
225
225
|
get id(){ return this.attributes.id ? this.attributes.id : null; }
|
|
226
226
|
set id(newValue){ this.attributes.id=newValue; }
|
|
227
227
|
get className(){return this.attributes.class || null}
|
|
228
228
|
get parentNode(){ return this.parent }
|
|
229
229
|
get ancestors(){
|
|
230
230
|
if(!this.parent) return []
|
|
231
231
|
const ancestors=[]
|
|
232
232
|
let element=this.parent
|
|
233
233
|
while (element.tagName!=='ROOT'){
|
|
234
234
|
ancestors.push(element)
|
|
235
235
|
element=element.parent
|
|
236
236
|
}
|
|
237
237
|
return ancestors.reverse()
|
|
238
238
|
}
|
|
239
239
|
get childNodeIndex(){
|
|
240
240
|
if(!this.parent) return null
|
|
241
241
|
return this.parent.childNodes ? this.parent.childNodes.indexOf(this) : null
|
|
242
242
|
}
|
|
243
243
|
get childIndex(){
|
|
244
244
|
if(!this.parent) return null
|
|
245
245
|
return this.parent.children ? this.parent.children.indexOf(this) : null
|
|
246
246
|
}
|
|
247
247
|
get previousElementSibling(){ return this.prev }
|
|
248
248
|
get prev(){
|
|
249
249
|
if (!this.childIndex) return null
|
|
250
250
|
return this.parent.children[this.childIndex-1]
|
|
251
251
|
}
|
|
252
252
|
get nextElementSibling(){ return this.next }
|
|
253
253
|
get next(){
|
|
254
254
|
if (!this.childIndex) return null
|
|
255
255
|
return this.parent.children[this.childIndex+1] || null
|
|
256
256
|
}
|
|
257
257
|
get dataset(){
|
|
258
258
|
if (!this._dataset) this._dataset=getDataset(this);
|
|
259
259
|
return this._dataset;
|
|
260
260
|
}
|
|
261
261
|
get classList(){
|
|
262
262
|
if (!this._classList) this._classList=new NodeClassList(this);
|
|
263
263
|
return this._classList;
|
|
264
264
|
}
|
|
265
265
|
get style(){
|
|
266
266
|
if (!this.__style) this.__style=buildStyle(this.attributes)
|
|
267
267
|
return this.__style
|
|
268
268
|
}
|
|
269
269
|
get outerHTML(){
|
|
270
270
|
const attrs=Object.entries(this.attributes).map(([key,val])=>val.length ? `${key}="${val}"` : key).join(" ");
|
|
271
271
|
return `<${this.tagName}${attrs ? ' '+attrs : ''}>${this.innerHTML}</${this.tagName}>`;
|
|
272
272
|
}
|
|
273
273
|
getAttribute(attrName){ return this.attributes[attrName] || null }
|
|
274
274
|
setAttribute(attrName,value){ this.attributes[attrName]=value }
|
|
275
275
|
removeAttribute(attrName){ delete this.attributes[attrName] }
|
|
276
276
|
remove(){
|
|
277
277
|
if (!this.parent) return
|
|
278
278
|
const index=this.childNodeIndex;
|
|
279
279
|
if (index!==null) this.parent.childNodes.splice(index,1);
|
|
280
280
|
}
|
|
281
281
|
get innerHTML(){
|
|
282
282
|
return this.childNodes.map(child=>{
|
|
283
283
|
if (child instanceof Node || child instanceof SingleNode) return child.outerHTML;
|
|
284
284
|
else if (child instanceof TextNode) return child.textContent;
|
|
285
285
|
else return child
|
|
286
286
|
}).join("");
|
|
287
287
|
}
|
|
288
288
|
$$(query){return this.querySelectorAll(query)}
|
|
289
289
|
querySelectorAll(query){
|
|
290
290
|
const selectors=Query.get(query)
|
|
291
291
|
return find(selectors,this,new Set())
|
|
292
292
|
}
|
|
293
293
|
$(query){return this.querySelector(query)}
|
|
294
294
|
querySelector(query){
|
|
295
295
|
const selectors=Query.get(query)
|
|
296
296
|
return find(selectors,this,new Set(),true)[0] || null
|
|
297
297
|
}
|
|
298
298
|
getElementsByClassName(query){ return this.querySelectorAll('.'+query) }
|
|
299
299
|
getElementsByTagName(query){ return this.querySelectorAll(query) }
|
|
300
300
|
getElementById(query){ return this.querySelector('#'+query) }
|
|
301
301
|
get children(){
|
|
302
302
|
return this.childNodes.filter(child=>{
|
|
303
303
|
if (!(child instanceof Node)) return false
|
|
304
304
|
if (child.tagName==='#comment') return false
|
|
305
305
|
return true
|
|
306
306
|
});
|
|
307
307
|
}
|
|
308
308
|
insertAdjacentElement(position,newElement){
|
|
309
309
|
if(newElement.tagName==='ROOT' && newElement.childNodes.length>0) newElement=newElement.childNodes[0]
|
|
310
310
|
const pos=position.toLowerCase();
|
|
311
311
|
if(pos==='afterbegin' || pos==='beforeend'){
|
|
312
312
|
if (pos==="afterbegin") this.childNodes.unshift(newElement);
|
|
313
313
|
else if (pos==="beforeend") this.childNodes.push(newElement);
|
|
314
314
|
newElement.parent=this
|
|
315
315
|
return newElement
|
|
316
316
|
}
|
|
317
317
|
if (!this.parent) throw new Error("Can't insert element to element without parent")
|
|
318
318
|
if (pos==="beforebegin") insertBefore(this.parent.childNodes,this.childNodeIndex,newElement)
|
|
319
319
|
else if (pos==="afterend") this.parent.childNodes.splice(this.childNodeIndex+1,0,newElement);
|
|
320
320
|
newElement.parent=this.parent
|
|
321
321
|
return newElement
|
|
322
322
|
}
|
|
323
323
|
insertAdjacentHTML(position,html){
|
|
324
324
|
const newNode=parseHTML(html);
|
|
325
325
|
newNode.childNodes.reverse().forEach(node=>{
|
|
326
326
|
this.insertAdjacentElement(position,node);
|
|
327
327
|
});
|
|
328
328
|
return newNode
|
|
329
329
|
}
|
|
330
330
|
insertAdjacentText(position,text){
|
|
331
331
|
return this.insertAdjacentElement(position,new TextNode(text));
|
|
332
332
|
}
|
|
333
333
|
insert(position,element){
|
|
334
334
|
const positions=['beforebegin','afterbegin','beforeend','afterend']
|
|
335
335
|
if(positions[position]) position=positions[position]
|
|
336
336
|
if(typeof element==='string'){
|
|
337
337
|
element=element.trim()
|
|
338
338
|
if(element.startsWith('<') && element.endsWith('>')){
|
|
339
339
|
return this.insertAdjacentHTML(position,element)
|
|
340
340
|
}
|
|
341
341
|
return this.insertAdjacentText(position,element)
|
|
342
342
|
}
|
|
343
343
|
return this.insertAdjacentElement(position,element)
|
|
344
344
|
}
|
|
345
345
|
set innerHTML(html){
|
|
346
346
|
const parsed=parseHTML(html);
|
|
347
347
|
this.childNodes=parsed.childNodes;
|
|
348
348
|
}
|
|
349
349
|
set outerHTML(html){
|
|
350
350
|
const parsed=parseHTML(html);
|
|
351
351
|
if (!this.parent) return console.log('element has no parent node')
|
|
352
352
|
const index=this.childIndex
|
|
353
353
|
if (index!==null) this.parent.childNodes.splice(index,1,...parsed.childNodes);
|
|
354
354
|
}
|
|
355
355
|
appendChild(newChild){
|
|
356
356
|
if (newChild instanceof Node || newChild instanceof TextNode || newChild instanceof SingleNode){
|
|
357
357
|
if (newChild.parent) newChild.parent.childNodes=newChild.parent.childNodes.filter(child=>child!==newChild);
|
|
358
358
|
} else if(typeof newChild==='string') newChild=new TextNode(newChild)
|
|
359
359
|
else return newChild
|
|
360
360
|
this.childNodes.push(newChild);
|
|
361
361
|
newChild.parent=this;
|
|
362
362
|
return newChild;
|
|
363
363
|
}
|
|
364
364
|
get textContent(){
|
|
365
365
|
if (this.childNodes.length===0) return this.nodeName==='#text' ? this.nodeValue : '';
|
|
366
366
|
return this.childNodes.map(child=>{
|
|
367
367
|
if(child instanceof SingleNode) return ''
|
|
368
368
|
if(child instanceof TextNode) return child.nodeValue
|
|
369
369
|
if(child instanceof Node) return child.textContent;
|
|
370
370
|
else return child;
|
|
371
371
|
}).join(" ");
|
|
372
372
|
}
|
|
373
373
|
set textContent(value){
|
|
374
374
|
this.childNodes=[];
|
|
375
375
|
if (value!==null && value!==undefined){
|
|
376
376
|
this.childNodes.push(value.toString());
|
|
377
377
|
}
|
|
378
378
|
}
|
|
379
379
|
}
|
|
380
380
|
class SingleNode extends Node{
|
|
381
381
|
constructor(tagName,attributes={},parent=null){
|
|
382
382
|
if(attributes['?'] && tagName==='?xml') delete attributes['?']
|
|
383
383
|
super(tagName,attributes,parent);
|
|
384
384
|
this.isSingle=true
|
|
385
385
|
}
|
|
386
386
|
get outerHTML(){
|
|
387
387
|
if (this.tagName==="#cdata-section") return `<![CDATA[${this.nodeValue}]]>`;
|
|
388
388
|
const attrs=Object.entries(this.attributes).map(([key,val])=>val.length ? `${key}="${val}"` : key).join(" ");
|
|
389
389
|
return `<${this.tagName} ${attrs}${this.tagName==='?xml' ? '?' : ''}>`;
|
|
390
390
|
}
|
|
391
391
|
get innerHTML(){ return ""; }
|
|
392
392
|
set innerHTML(_){ }
|
|
393
393
|
$(_){return null}
|
|
394
394
|
$$(_){return []}
|
|
395
395
|
querySelectorAll(_){ return []; }
|
|
396
396
|
querySelector(_){ return null; }
|
|
397
397
|
getElementsByClassName(_){ return []; }
|
|
398
398
|
getElementsByTagName(_){ return []; }
|
|
399
399
|
getElementById(_){ return null; }
|
|
400
400
|
get children(){ return []; }
|
|
401
401
|
insertAdjacentElement(_,__){ }
|
|
402
402
|
insertAdjacentHTML(_,__){ }
|
|
403
403
|
insertAdjacentText(_,__){ }
|
|
404
404
|
appendChild(_){ }
|
|
405
405
|
insert(_,__){ }
|
|
406
406
|
get textContent(){ return ""; }
|
|
407
407
|
set textContent(_){ }
|
|
408
408
|
}
|