@joyzl/eno 1.1.2 → 1.1.3

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.
Files changed (2) hide show
  1. package/index.js +149 -114
  2. package/package.json +1 -1
package/index.js CHANGED
@@ -68,19 +68,22 @@ function append(element, html) {
68
68
  // append(element,html);
69
69
  element = select(element);
70
70
  } else {
71
- return;
72
- }
73
- if (html.trim) {
74
- html = create(html);
71
+ return null;
75
72
  }
76
- if (Array.isArray(html)) {
77
- for (let i = 0; i < html.length; i++) {
78
- element.appendChild(html[i]);
73
+ if (element) {
74
+ if (html.trim) {
75
+ html = create(html);
79
76
  }
80
- } else {
81
- element.appendChild(html);
77
+ if (Array.isArray(html)) {
78
+ for (let i = 0; i < html.length; i++) {
79
+ element.appendChild(html[i]);
80
+ }
81
+ } else {
82
+ element.appendChild(html);
83
+ }
84
+ return html;
82
85
  }
83
- return html;
86
+ return null;
84
87
  }
85
88
 
86
89
  /**
@@ -93,35 +96,38 @@ function replace(element, html) {
93
96
  if (arguments.length == 2) {
94
97
  element = select(element);
95
98
  } else {
96
- return;
97
- }
98
- if (html.trim) {
99
- html = create(html);
99
+ return null;
100
100
  }
101
- if (element.parentElement) {
102
- if (Array.isArray(html)) {
103
- let item;
104
- for (let i = 0; i < html.length; i++) {
105
- item = html[i];
101
+ if (element) {
102
+ if (html.trim) {
103
+ html = create(html);
104
+ }
105
+ if (element.parentElement) {
106
+ if (Array.isArray(html)) {
107
+ let item;
108
+ for (let i = 0; i < html.length; i++) {
109
+ item = html[i];
110
+ if (element.className) {
111
+ item.className += " " + element.className;
112
+ }
113
+ if (element.style.cssText) {
114
+ item.style.cssText += element.style.cssText;
115
+ }
116
+ }
117
+ element.replaceWith(html);
118
+ } else {
106
119
  if (element.className) {
107
- item.className += element.className;
120
+ html.className += " " + element.className;
108
121
  }
109
122
  if (element.style.cssText) {
110
- item.style.cssText += element.style.cssText;
123
+ html.style.cssText += element.style.cssText;
111
124
  }
125
+ element.parentElement.replaceChild(html, element);
112
126
  }
113
- element.replaceWith(html);
114
- } else {
115
- if (element.className) {
116
- html.className += element.className;
117
- }
118
- if (element.style.cssText) {
119
- html.style.cssText += element.style.cssText;
120
- }
121
- element.parentElement.replaceChild(html, element);
122
127
  }
128
+ return html;
123
129
  }
124
- return html;
130
+ return null;
125
131
  }
126
132
 
127
133
  /**
@@ -234,16 +240,22 @@ function hide(element, selector) {
234
240
  }
235
241
  if (element) {
236
242
  if (Array.isArray(element)) {
243
+ let e;
237
244
  for (let i = 0; i < element.length; i++) {
238
- element[i].hidden = true;
239
- element[i].__DISPLAY = element[i].style.display
240
- element[i].style.display = "none";
245
+ e = element[i];
246
+ if (e.hidden) {} else {
247
+ e.hidden = true;
248
+ e.__DISPLAY = e.style.display
249
+ e.style.display = "none";
250
+ }
241
251
  }
242
252
  } else {
243
- element.hidden = true;
244
- element.__DISPLAY = element.style.display
245
- // display:flex 导致 hidden 属性失效而不会隐藏
246
- element.style.display = "none";
253
+ if (element.hidden) {} else {
254
+ element.hidden = true;
255
+ element.__DISPLAY = element.style.display;
256
+ // display:flex 导致 hidden 属性失效而不会隐藏
257
+ element.style.display = "none";
258
+ }
247
259
  }
248
260
  }
249
261
  return element;
@@ -266,11 +278,16 @@ function show(element, selector) {
266
278
  }
267
279
  if (element) {
268
280
  if (Array.isArray(element)) {
281
+ let e;
269
282
  for (let i = 0; i < element.length; i++) {
270
- element[i].hidden = false;
271
- element[i].style.display = element[i].__DISPLAY;
283
+ e = element[i];
284
+ if (e.hidden) {
285
+ e.hidden = false;
286
+ e.style.display = e.__DISPLAY;
287
+ }
272
288
  }
273
- } else {
289
+ } else
290
+ if (element.hidden) {
274
291
  element.hidden = false;
275
292
  element.style.display = element.__DISPLAY;
276
293
  }
@@ -283,32 +300,41 @@ function show(element, selector) {
283
300
  * 如果指定样式类名,则当前原始添加样式类,其余元素移除样式类
284
301
  * @param {Element} element 标签元素
285
302
  * @param {String} selector 筛选字符
286
- * @param {String} className 类名称
303
+ * @param {String} applyClass 添加类名称,必须同时提供otherClass参数
304
+ * @param {String} otherClass 移除类名称,必须同时提供applyClass参数
287
305
  * @return {Element} 显示的单个/多个标签元素
288
306
  */
289
- function toggle(element, selector, className) {
307
+ function toggle(element, selector, applyClass, otherClass) {
290
308
  if (arguments.length == 1) {
291
- // toggle(element)
309
+ // toggle(element)
292
310
  element = select(element);
293
311
  } else
294
312
  if (arguments.length == 2) {
295
313
  // toggle(element,selector)
296
- // toggle(element,className)
297
314
  element = select(element, selector);
298
315
  } else
299
316
  if (arguments.length == 3) {
300
- // toggle(element,selector,className)
317
+ // toggle(element,applyClass,otherClass)
318
+ element = select(element);
319
+ otherClass = applyClass;
320
+ applyClass = selector;
321
+ } else
322
+ if (arguments.length == 4) {
323
+ // toggle(element,selector,applyClass,otherClass)
301
324
  element = select(element, selector);
302
325
  } else {
303
326
  return;
304
327
  }
305
328
  if (element) {
306
329
  const parent = element.parentElement;
307
- if (className) {
330
+ if (applyClass) {
308
331
  for (let i = 0; i < parent.children.length; i++) {
309
- parent.children[i].classList.remove(className);
310
332
  if (element == parent.children[i]) {
311
- parent.children[i].classList.add(className);
333
+ parent.children[i].classList.remove(otherClass);
334
+ parent.children[i].classList.add(applyClass);
335
+ } else {
336
+ parent.children[i].classList.remove(applyClass);
337
+ parent.children[i].classList.add(otherClass);
312
338
  }
313
339
  }
314
340
  } else {
@@ -409,71 +435,71 @@ function sets(element, selector, parameter, converter = defaultConverter) {
409
435
  if (element) {
410
436
  if (parameter) {
411
437
  if (Array.isArray(parameter)) {
438
+ // Object[] -> Element.children
412
439
  let i = 0;
413
440
  // 利用ENO_SET记录并判定是否首次
414
- if (element.ENO_SETS) {
415
- element.ENO_SETS = element.ENO_SETS + 1;
416
- } else {
417
- element.ENO_SETS = 1;
418
- // ...<template>...
419
- for (; i < element.children.length; i++) {
420
- // 只有<template>模板具有content属性
441
+ if (element.__ENO_SETS) {} else {
442
+ element.__ENO_SETS = {};
443
+ // before...<template>...after
444
+ // 只有<template>模板具有content属性
445
+ // 记录模板前后已有标签元素数量
446
+ // before数量包括模板本身
447
+ for (; i < element.childElementCount; i++) {
421
448
  if (element.children[i].content) {
422
- element.template = element.children[i];
423
- element.a = ++i;
424
- element.b = element.children.length - i;
449
+ element.__ENO_SETS.template = element.children[i];
450
+ element.__ENO_SETS.before = ++i;
451
+ element.__ENO_SETS.after = element.childElementCount - i;
425
452
  break;
426
453
  }
427
454
  }
428
455
  }
429
456
 
430
- if (element.template) {
457
+ if (element.__ENO_SETS.template) {
431
458
  // 已定义模板
432
- if (parameter.length) { // [a,b]
459
+ if (parameter.length) {
433
460
  let node, n;
434
461
  // 构造填充元素
435
462
  for (i = 0; i < parameter.length; i++) {
436
- if (element.a + i < element.children.length - element.b) {
463
+ if (element.__ENO_SETS.before + i < element.childElementCount - element.__ENO_SETS.after) {
437
464
  // 重用已有元素
438
- for (n = 0; n < element.template.content.childElementCount; n++) {
439
- node = element.children[element.a + i + n];
440
- node.userData = parameter[i];
465
+ for (n = 0; n < element.__ENO_SETS.template.content.childElementCount; n++) {
466
+ node = element.children[element.__ENO_SETS.before + i + n];
441
467
  set(node, parameter[i], converter);
442
- node.hidden = false;
468
+ node.userData = parameter[i];
443
469
  }
444
470
  } else {
445
471
  // 克隆新的元素(DocumentFragment)
446
- node = element.template.content.cloneNode(true);
472
+ // node = element.template.content.cloneNode(true);
473
+ node = document.importNode(element.__ENO_SETS.template.content, true);
447
474
  for (n = 0; n < node.childElementCount; n++) {
448
- node.children.item(n).userData = parameter[i];
449
475
  set(node.children.item(n), parameter[i], converter);
450
- node.children.item(n).hidden = false;
476
+ node.children.item(n).userData = parameter[i];
451
477
  }
452
- element.insertBefore(node, element.children[element.a + i * node.childElementCount]);
478
+ element.insertBefore(node, element.children[element.__ENO_SETS.before + i * node.childElementCount]);
453
479
  }
454
480
  }
455
481
  // 移除多余元素
456
- n = i * element.template.content.childElementCount;
457
- i = element.a + element.b;
458
- while (element.children.length > i + n) {
459
- element.children[element.a + n].remove();
482
+ n = i * element.__ENO_SETS.template.content.childElementCount;
483
+ i = element.__ENO_SETS.before + element.__ENO_SETS.after;
484
+ while (element.childElementCount > i + n) {
485
+ element.children[element.__ENO_SETS.before + n].remove();
460
486
  }
461
487
  return element;
462
- } else { // []
488
+ } else {
463
489
  // 移除多余元素
464
- i = element.a + element.b;
465
- while (element.length > i) {
466
- element[element.a + 1].remove();
490
+ i = element.__ENO_SETS.before + element.__ENO_SETS.after;
491
+ while (element.childElementCount > i) {
492
+ element.children[element.childElementCount - element.__ENO_SETS.after - 1].remove();
467
493
  }
468
494
  return element;
469
495
  }
470
496
  } else {
471
497
  // 未使用模板
472
- if (parameter.length) { // [a,b]
498
+ if (parameter.length) {
473
499
  let node;
474
500
  // 构造填充元素
475
501
  for (i = 0; i < parameter.length; i++) {
476
- if (i < element.children.length) {
502
+ if (i < element.childElementCount) {
477
503
  // 重用已有元素
478
504
  node = element.children[i];
479
505
  } else if (node) {
@@ -481,59 +507,68 @@ function sets(element, selector, parameter, converter = defaultConverter) {
481
507
  node = element.appendChild(node.cloneNode(true));
482
508
  } else {
483
509
  // 干不了
510
+ // 此情形出现于没有任何子标签元素
484
511
  continue;
485
512
  }
486
- node.userData = parameter[i];
487
513
  set(node, parameter[i], converter);
514
+ node.userData = parameter[i];
488
515
  node.hidden = false;
489
516
  }
490
517
  // 移除多余元素
491
- while (element.children.length > i) {
518
+ while (element.childElementCount > i) {
492
519
  element.children[i].remove();
493
520
  }
494
521
  return element;
495
- } else { // []
496
- if (element.children.length) {
497
- // 保留模板
498
- element.children[0].hidden = true;
499
- // 移除多余元素
500
- while (element.children.length > 1) {
501
- element.children[1].remove();
502
- }
522
+ } else {
523
+ // 移除多余元素,保留模板
524
+ element.children[0].userData = null;
525
+ element.children[0].hidden = true;
526
+ while (element.childElementCount > 1) {
527
+ element.children[1].remove();
503
528
  }
504
529
  return element;
505
530
  }
506
531
  }
507
- } else { // Object
508
- if (element.nodeType) {
509
- element.userData = parameter;
510
- set(element, parameter, converter);
511
- return element;
512
- }
513
- if (element.length) {
514
- for (let node, i = 0; i < element.length; i++) {
515
- node = element[i];
516
- node.userData = parameter;
517
- set(node, parameter, converter);
532
+ } else {
533
+ // Object -> Element
534
+ if (Array.isArray(element)) {
535
+ for (let i = 0; i < element.length; i++) {
536
+ set(element[i], parameter, converter);
537
+ element[i].userData = parameter;
518
538
  }
519
- return element;
539
+ } else {
540
+ set(element, parameter, converter);
541
+ element.userData = parameter;
520
542
  }
521
- }
522
- } else { // null / undefine
523
- if (element.nodeType) {
524
- element.userData = null;
525
- set(element, null, converter);
526
543
  return element;
527
544
  }
528
- if (element.length) {
529
- // 保留模板
530
- element[0].hidden = true;
531
- // 移除多余元素
532
- while (element.length > 1) {
533
- element[1].remove();
545
+ } else {
546
+ // null / undefine -> Element
547
+ if (element.__ENO_SETS) {
548
+ if (element.__ENO_SETS.template) {
549
+ const i = element.__ENO_SETS.before + element.__ENO_SETS.after;
550
+ while (element.childElementCount > i) {
551
+ element.children[element.childElementCount - element.__ENO_SETS.after - 1].remove();
552
+ }
553
+ } else {
554
+ element.children[0].userData = null;
555
+ element.children[0].hidden = true;
556
+ while (element.childElementCount > 1) {
557
+ element.children[1].remove();
558
+ }
559
+ }
560
+ } else {
561
+ if (Array.isArray(element)) {
562
+ for (let i = 0; i < element.length; i++) {
563
+ set(element[i], null, converter);
564
+ element[i].userData = null;
565
+ }
566
+ } else {
567
+ set(element, null, converter);
568
+ element.userData = null;
534
569
  }
535
- return element;
536
570
  }
571
+ return element;
537
572
  }
538
573
  }
539
574
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@joyzl/eno",
3
- "version": "1.1.2",
3
+ "version": "1.1.3",
4
4
  "description": "Easy Node Object",
5
5
  "main": "index.js",
6
6
  "scripts": {