@whitesev/domutils 1.6.5 → 1.6.7
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 +42 -42
- package/dist/index.amd.js +267 -301
- package/dist/index.amd.js.map +1 -1
- package/dist/index.cjs.js +267 -301
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +267 -301
- package/dist/index.esm.js.map +1 -1
- package/dist/index.iife.js +267 -301
- package/dist/index.iife.js.map +1 -1
- package/dist/index.system.js +267 -301
- package/dist/index.system.js.map +1 -1
- package/dist/index.umd.js +267 -301
- package/dist/index.umd.js.map +1 -1
- package/dist/types/src/DOMUtils.d.ts +34 -5
- package/dist/types/src/DOMUtilsCommonUtils.d.ts +2 -2
- package/dist/types/src/DOMUtilsEvent.d.ts +64 -64
- package/dist/types/src/types/DOMUtilsEvent.d.ts +142 -142
- package/dist/types/src/types/WindowApi.d.ts +9 -9
- package/dist/types/src/types/global.d.ts +2 -10
- package/dist/types/src/types/gm.d.ts +5 -1
- package/index.ts +3 -0
- package/package.json +19 -7
- package/src/DOMUtils.ts +1967 -1974
- package/src/DOMUtilsCommonUtils.ts +196 -196
- package/src/DOMUtilsData.ts +2 -2
- package/src/DOMUtilsEvent.ts +1407 -1459
- package/src/DOMUtilsOriginPrototype.ts +3 -3
- package/src/WindowApi.ts +55 -55
- package/src/types/DOMUtilsEvent.d.ts +142 -142
- package/src/types/WindowApi.d.ts +9 -9
- package/src/types/global.d.ts +2 -10
- package/src/types/gm.d.ts +5 -1
package/dist/index.system.js
CHANGED
|
@@ -328,10 +328,8 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
328
328
|
* 获取安全的html
|
|
329
329
|
*/
|
|
330
330
|
getSafeHTML(text) {
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
// @ts-ignore
|
|
334
|
-
const policy = globalThis.trustedTypes.createPolicy("safe-innerHTML", {
|
|
331
|
+
if (window.trustedTypes) {
|
|
332
|
+
const policy = window.trustedTypes.createPolicy("safe-innerHTML", {
|
|
335
333
|
createHTML: (html) => html,
|
|
336
334
|
});
|
|
337
335
|
return policy.createHTML(text);
|
|
@@ -354,7 +352,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
354
352
|
* @param element
|
|
355
353
|
*/
|
|
356
354
|
showElement(element) {
|
|
357
|
-
|
|
355
|
+
const dupNode = element.cloneNode(true);
|
|
358
356
|
dupNode.setAttribute("style", "visibility: hidden !important;display:block !important;");
|
|
359
357
|
this.windowApi.document.documentElement.appendChild(dupNode);
|
|
360
358
|
return {
|
|
@@ -385,7 +383,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
385
383
|
}
|
|
386
384
|
styles = view.getComputedStyle(element);
|
|
387
385
|
}
|
|
388
|
-
|
|
386
|
+
const value = parseFloat(styles[styleName]);
|
|
389
387
|
if (isNaN(value)) {
|
|
390
388
|
return 0;
|
|
391
389
|
}
|
|
@@ -450,7 +448,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
450
448
|
try {
|
|
451
449
|
return setTimeout$1(callback, timeout);
|
|
452
450
|
}
|
|
453
|
-
catch
|
|
451
|
+
catch {
|
|
454
452
|
return this.windowApi.setTimeout(callback, timeout);
|
|
455
453
|
}
|
|
456
454
|
},
|
|
@@ -463,7 +461,8 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
463
461
|
clearTimeout$1(timeId);
|
|
464
462
|
}
|
|
465
463
|
}
|
|
466
|
-
catch
|
|
464
|
+
catch {
|
|
465
|
+
// TODO
|
|
467
466
|
}
|
|
468
467
|
finally {
|
|
469
468
|
this.windowApi.clearTimeout(timeId);
|
|
@@ -476,7 +475,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
476
475
|
try {
|
|
477
476
|
return setInterval$1(callback, timeout);
|
|
478
477
|
}
|
|
479
|
-
catch
|
|
478
|
+
catch {
|
|
480
479
|
return this.windowApi.setInterval(callback, timeout);
|
|
481
480
|
}
|
|
482
481
|
},
|
|
@@ -489,7 +488,8 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
489
488
|
clearInterval$1(timeId);
|
|
490
489
|
}
|
|
491
490
|
}
|
|
492
|
-
catch
|
|
491
|
+
catch {
|
|
492
|
+
// TODO
|
|
493
493
|
}
|
|
494
494
|
finally {
|
|
495
495
|
this.windowApi.clearInterval(timeId);
|
|
@@ -537,7 +537,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
537
537
|
* @param option
|
|
538
538
|
*/
|
|
539
539
|
function getOption(args, startIndex, option) {
|
|
540
|
-
|
|
540
|
+
const currentParam = args[startIndex];
|
|
541
541
|
if (typeof currentParam === "boolean") {
|
|
542
542
|
option.capture = currentParam;
|
|
543
543
|
if (typeof args[startIndex + 1] === "boolean") {
|
|
@@ -559,8 +559,9 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
559
559
|
}
|
|
560
560
|
return option;
|
|
561
561
|
}
|
|
562
|
-
|
|
563
|
-
|
|
562
|
+
const DOMUtilsContext = this;
|
|
563
|
+
// eslint-disable-next-line prefer-rest-params
|
|
564
|
+
const args = arguments;
|
|
564
565
|
if (typeof element === "string") {
|
|
565
566
|
element = DOMUtilsContext.selectorAll(element);
|
|
566
567
|
}
|
|
@@ -636,14 +637,14 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
636
637
|
totalParent = DOMUtilsContext.windowApi.document.documentElement;
|
|
637
638
|
}
|
|
638
639
|
}
|
|
639
|
-
|
|
640
|
+
const findValue = selectorList.find((selectorItem) => {
|
|
640
641
|
// 判断目标元素是否匹配选择器
|
|
641
642
|
if (DOMUtilsContext.matches(eventTarget, selectorItem)) {
|
|
642
643
|
/* 当前目标可以被selector所匹配到 */
|
|
643
644
|
return true;
|
|
644
645
|
}
|
|
645
646
|
/* 在上层与主元素之间寻找可以被selector所匹配到的 */
|
|
646
|
-
|
|
647
|
+
const $closestMatches = DOMUtilsContext.closest(eventTarget, selectorItem);
|
|
647
648
|
if ($closestMatches && totalParent?.contains($closestMatches)) {
|
|
648
649
|
eventTarget = $closestMatches;
|
|
649
650
|
return true;
|
|
@@ -659,7 +660,9 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
659
660
|
},
|
|
660
661
|
});
|
|
661
662
|
}
|
|
662
|
-
catch
|
|
663
|
+
catch {
|
|
664
|
+
// TODO
|
|
665
|
+
}
|
|
663
666
|
listenerCallBack.call(eventTarget, event, eventTarget);
|
|
664
667
|
checkOptionOnceToRemoveEventListener();
|
|
665
668
|
}
|
|
@@ -674,7 +677,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
674
677
|
eventTypeList.forEach((eventName) => {
|
|
675
678
|
elementItem.addEventListener(eventName, domUtilsEventCallBack, listenerOption);
|
|
676
679
|
/* 获取对象上的事件 */
|
|
677
|
-
|
|
680
|
+
const elementEvents = Reflect.get(elementItem, DOMUtilsData.SymbolEvents) || {};
|
|
678
681
|
/* 初始化对象上的xx事件 */
|
|
679
682
|
elementEvents[eventName] = elementEvents[eventName] || [];
|
|
680
683
|
elementEvents[eventName].push({
|
|
@@ -696,7 +699,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
696
699
|
* @param option
|
|
697
700
|
*/
|
|
698
701
|
function getOption(args1, startIndex, option) {
|
|
699
|
-
|
|
702
|
+
const currentParam = args1[startIndex];
|
|
700
703
|
if (typeof currentParam === "boolean") {
|
|
701
704
|
option.capture = currentParam;
|
|
702
705
|
}
|
|
@@ -705,8 +708,9 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
705
708
|
}
|
|
706
709
|
return option;
|
|
707
710
|
}
|
|
708
|
-
|
|
709
|
-
|
|
711
|
+
const DOMUtilsContext = this;
|
|
712
|
+
// eslint-disable-next-line prefer-rest-params
|
|
713
|
+
const args = arguments;
|
|
710
714
|
if (typeof element === "string") {
|
|
711
715
|
element = DOMUtilsContext.selectorAll(element);
|
|
712
716
|
}
|
|
@@ -768,14 +772,14 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
768
772
|
}
|
|
769
773
|
elementList.forEach((elementItem) => {
|
|
770
774
|
/* 获取对象上的事件 */
|
|
771
|
-
|
|
775
|
+
const elementEvents = Reflect.get(elementItem, DOMUtilsData.SymbolEvents) || {};
|
|
772
776
|
eventTypeList.forEach((eventName) => {
|
|
773
777
|
let handlers = elementEvents[eventName] || [];
|
|
774
778
|
if (typeof filter === "function") {
|
|
775
779
|
handlers = handlers.filter(filter);
|
|
776
780
|
}
|
|
777
781
|
for (let index = 0; index < handlers.length; index++) {
|
|
778
|
-
|
|
782
|
+
const handler = handlers[index];
|
|
779
783
|
let flag = true;
|
|
780
784
|
if (flag && listenerCallBack && handler.originCallBack !== listenerCallBack) {
|
|
781
785
|
// callback不同
|
|
@@ -810,7 +814,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
810
814
|
* @param eventType （可选）需要取消监听的事件
|
|
811
815
|
*/
|
|
812
816
|
offAll(element, eventType) {
|
|
813
|
-
|
|
817
|
+
const DOMUtilsContext = this;
|
|
814
818
|
if (typeof element === "string") {
|
|
815
819
|
element = DOMUtilsContext.selectorAll(element);
|
|
816
820
|
}
|
|
@@ -836,10 +840,10 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
836
840
|
if (!symbolEvents.toString().startsWith("Symbol(events_")) {
|
|
837
841
|
return;
|
|
838
842
|
}
|
|
839
|
-
|
|
840
|
-
|
|
843
|
+
const elementEvents = elementItem[symbolEvents] || {};
|
|
844
|
+
const iterEventNameList = eventTypeList.length ? eventTypeList : Object.keys(elementEvents);
|
|
841
845
|
iterEventNameList.forEach((eventName) => {
|
|
842
|
-
|
|
846
|
+
const handlers = elementEvents[eventName];
|
|
843
847
|
if (!handlers) {
|
|
844
848
|
return;
|
|
845
849
|
}
|
|
@@ -848,7 +852,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
848
852
|
capture: handler["option"]["capture"],
|
|
849
853
|
});
|
|
850
854
|
}
|
|
851
|
-
|
|
855
|
+
const events = Reflect.get(elementItem, symbolEvents);
|
|
852
856
|
DOMUtilsCommonUtils.delete(events, eventName);
|
|
853
857
|
});
|
|
854
858
|
});
|
|
@@ -866,7 +870,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
866
870
|
if (typeof callback !== "function") {
|
|
867
871
|
return;
|
|
868
872
|
}
|
|
869
|
-
|
|
873
|
+
const DOMUtilsContext = this;
|
|
870
874
|
/**
|
|
871
875
|
* 检测文档是否加载完毕
|
|
872
876
|
*/
|
|
@@ -881,7 +885,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
881
885
|
return false;
|
|
882
886
|
}
|
|
883
887
|
}
|
|
884
|
-
catch
|
|
888
|
+
catch {
|
|
885
889
|
return false;
|
|
886
890
|
}
|
|
887
891
|
}
|
|
@@ -892,7 +896,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
892
896
|
removeDomReadyListener();
|
|
893
897
|
callback();
|
|
894
898
|
}
|
|
895
|
-
|
|
899
|
+
const targetList = [
|
|
896
900
|
{
|
|
897
901
|
target: DOMUtilsContext.windowApi.document,
|
|
898
902
|
eventType: "DOMContentLoaded",
|
|
@@ -909,7 +913,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
909
913
|
*/
|
|
910
914
|
function addDomReadyListener() {
|
|
911
915
|
for (let index = 0; index < targetList.length; index++) {
|
|
912
|
-
|
|
916
|
+
const item = targetList[index];
|
|
913
917
|
item.target.addEventListener(item.eventType, item.callback);
|
|
914
918
|
}
|
|
915
919
|
}
|
|
@@ -918,7 +922,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
918
922
|
*/
|
|
919
923
|
function removeDomReadyListener() {
|
|
920
924
|
for (let index = 0; index < targetList.length; index++) {
|
|
921
|
-
|
|
925
|
+
const item = targetList[index];
|
|
922
926
|
item.target.removeEventListener(item.eventType, item.callback);
|
|
923
927
|
}
|
|
924
928
|
}
|
|
@@ -946,7 +950,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
946
950
|
* DOMUtils.trigger("a.xx",["click","tap","hover"])
|
|
947
951
|
*/
|
|
948
952
|
trigger(element, eventType, details, useDispatchToTriggerEvent = true) {
|
|
949
|
-
|
|
953
|
+
const DOMUtilsContext = this;
|
|
950
954
|
if (typeof element === "string") {
|
|
951
955
|
element = DOMUtilsContext.selectorAll(element);
|
|
952
956
|
}
|
|
@@ -970,7 +974,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
970
974
|
}
|
|
971
975
|
elementList.forEach((elementItem) => {
|
|
972
976
|
/* 获取对象上的事件 */
|
|
973
|
-
|
|
977
|
+
const events = elementItem[DOMUtilsData.SymbolEvents] || {};
|
|
974
978
|
eventTypeList.forEach((_eventType_) => {
|
|
975
979
|
let event = null;
|
|
976
980
|
if (details && details instanceof Event) {
|
|
@@ -1010,7 +1014,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1010
1014
|
* })
|
|
1011
1015
|
* */
|
|
1012
1016
|
click(element, handler, details, useDispatchToTriggerEvent) {
|
|
1013
|
-
|
|
1017
|
+
const DOMUtilsContext = this;
|
|
1014
1018
|
if (typeof element === "string") {
|
|
1015
1019
|
element = DOMUtilsContext.selectorAll(element);
|
|
1016
1020
|
}
|
|
@@ -1046,7 +1050,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1046
1050
|
* })
|
|
1047
1051
|
* */
|
|
1048
1052
|
blur(element, handler, details, useDispatchToTriggerEvent) {
|
|
1049
|
-
|
|
1053
|
+
const DOMUtilsContext = this;
|
|
1050
1054
|
if (typeof element === "string") {
|
|
1051
1055
|
element = DOMUtilsContext.selectorAll(element);
|
|
1052
1056
|
}
|
|
@@ -1082,7 +1086,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1082
1086
|
* })
|
|
1083
1087
|
* */
|
|
1084
1088
|
focus(element, handler, details, useDispatchToTriggerEvent) {
|
|
1085
|
-
|
|
1089
|
+
const DOMUtilsContext = this;
|
|
1086
1090
|
if (typeof element === "string") {
|
|
1087
1091
|
element = DOMUtilsContext.selectorAll(element);
|
|
1088
1092
|
}
|
|
@@ -1118,7 +1122,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1118
1122
|
* })
|
|
1119
1123
|
*/
|
|
1120
1124
|
hover(element, handler, option) {
|
|
1121
|
-
|
|
1125
|
+
const DOMUtilsContext = this;
|
|
1122
1126
|
if (typeof element === "string") {
|
|
1123
1127
|
element = DOMUtilsContext.selectorAll(element);
|
|
1124
1128
|
}
|
|
@@ -1142,7 +1146,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1142
1146
|
* @param option 配置项，这里默认配置once为true
|
|
1143
1147
|
*/
|
|
1144
1148
|
animationend(element, handler, option) {
|
|
1145
|
-
|
|
1149
|
+
const DOMUtilsContext = this;
|
|
1146
1150
|
if (typeof element === "string") {
|
|
1147
1151
|
element = DOMUtilsContext.selector(element);
|
|
1148
1152
|
}
|
|
@@ -1177,7 +1181,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1177
1181
|
* @param option 配置项，这里默认配置once为true
|
|
1178
1182
|
*/
|
|
1179
1183
|
transitionend(element, handler, option) {
|
|
1180
|
-
|
|
1184
|
+
const DOMUtilsContext = this;
|
|
1181
1185
|
if (typeof element === "string") {
|
|
1182
1186
|
element = DOMUtilsContext.selector(element);
|
|
1183
1187
|
}
|
|
@@ -1221,7 +1225,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1221
1225
|
* })
|
|
1222
1226
|
*/
|
|
1223
1227
|
keyup(element, handler, option) {
|
|
1224
|
-
|
|
1228
|
+
const DOMUtilsContext = this;
|
|
1225
1229
|
if (element == null) {
|
|
1226
1230
|
return;
|
|
1227
1231
|
}
|
|
@@ -1253,7 +1257,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1253
1257
|
* })
|
|
1254
1258
|
*/
|
|
1255
1259
|
keydown(element, handler, option) {
|
|
1256
|
-
|
|
1260
|
+
const DOMUtilsContext = this;
|
|
1257
1261
|
if (element == null) {
|
|
1258
1262
|
return;
|
|
1259
1263
|
}
|
|
@@ -1285,7 +1289,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1285
1289
|
* })
|
|
1286
1290
|
*/
|
|
1287
1291
|
keypress(element, handler, option) {
|
|
1288
|
-
|
|
1292
|
+
const DOMUtilsContext = this;
|
|
1289
1293
|
if (element == null) {
|
|
1290
1294
|
return;
|
|
1291
1295
|
}
|
|
@@ -1302,80 +1306,80 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1302
1306
|
DOMUtilsContext.on(element, "keypress", null, handler, option);
|
|
1303
1307
|
}
|
|
1304
1308
|
/**
|
|
1305
|
-
|
|
1306
|
-
|
|
1307
|
-
|
|
1308
|
-
|
|
1309
|
-
|
|
1310
|
-
|
|
1311
|
-
|
|
1312
|
-
|
|
1313
|
-
|
|
1314
|
-
|
|
1315
|
-
|
|
1316
|
-
|
|
1317
|
-
|
|
1318
|
-
|
|
1319
|
-
|
|
1320
|
-
|
|
1321
|
-
|
|
1322
|
-
|
|
1323
|
-
|
|
1324
|
-
|
|
1325
|
-
|
|
1326
|
-
|
|
1327
|
-
|
|
1328
|
-
|
|
1329
|
-
|
|
1330
|
-
|
|
1331
|
-
|
|
1332
|
-
|
|
1333
|
-
|
|
1334
|
-
|
|
1335
|
-
|
|
1336
|
-
|
|
1337
|
-
|
|
1338
|
-
|
|
1339
|
-
|
|
1340
|
-
|
|
1341
|
-
|
|
1342
|
-
|
|
1343
|
-
|
|
1344
|
-
|
|
1345
|
-
|
|
1346
|
-
|
|
1347
|
-
|
|
1348
|
-
|
|
1349
|
-
|
|
1350
|
-
|
|
1351
|
-
|
|
1352
|
-
|
|
1353
|
-
|
|
1354
|
-
|
|
1355
|
-
|
|
1356
|
-
|
|
1357
|
-
|
|
1358
|
-
|
|
1359
|
-
|
|
1360
|
-
|
|
1361
|
-
|
|
1362
|
-
|
|
1363
|
-
|
|
1364
|
-
|
|
1365
|
-
|
|
1366
|
-
|
|
1309
|
+
* 监听某个元素键盘按键事件或window全局按键事件
|
|
1310
|
+
* 按下有值的键时触发，按下Ctrl\Alt\Shift\Meta是无值键。按下先触发keydown事件，再触发keypress事件。
|
|
1311
|
+
* @param element 需要监听的对象，可以是全局Window或者某个元素
|
|
1312
|
+
* @param eventName 事件名，默认keypress
|
|
1313
|
+
* @param callback 自己定义的回调事件，参数1为当前的key，参数2为组合按键，数组类型，包含ctrl、shift、alt和meta（win键或mac的cmd键）
|
|
1314
|
+
* @param options 监听事件的配置
|
|
1315
|
+
* @example
|
|
1316
|
+
Utils.listenKeyboard(window,(keyName,keyValue,otherKey,event)=>{
|
|
1317
|
+
if(keyName === "Enter"){
|
|
1318
|
+
console.log("回车按键的值是："+keyValue)
|
|
1319
|
+
}
|
|
1320
|
+
if(otherKey.indexOf("ctrl") && keyName === "Enter" ){
|
|
1321
|
+
console.log("Ctrl和回车键");
|
|
1322
|
+
}
|
|
1323
|
+
})
|
|
1324
|
+
* @example
|
|
1325
|
+
字母和数字键的键码值(keyCode)
|
|
1326
|
+
按键 键码 按键 键码 按键 键码 按键 键码
|
|
1327
|
+
A 65 J 74 S 83 1 49
|
|
1328
|
+
B 66 K 75 T 84 2 50
|
|
1329
|
+
C 67 L 76 U 85 3 51
|
|
1330
|
+
D 68 M 77 V 86 4 52
|
|
1331
|
+
E 69 N 78 W 87 5 53
|
|
1332
|
+
F 70 O 79 X 88 6 54
|
|
1333
|
+
G 71 P 80 Y 89 7 55
|
|
1334
|
+
H 72 Q 81 Z 90 8 56
|
|
1335
|
+
I 73 R 82 0 48 9 57
|
|
1336
|
+
|
|
1337
|
+
数字键盘上的键的键码值(keyCode)
|
|
1338
|
+
功能键键码值(keyCode)
|
|
1339
|
+
按键 键码 按键 键码 按键 键码 按键 键码
|
|
1340
|
+
0 96 8 104 F1 112 F7 118
|
|
1341
|
+
1 97 9 105 F2 113 F8 119
|
|
1342
|
+
2 98 * 106 F3 114 F9 120
|
|
1343
|
+
3 99 + 107 F4 115 F10 121
|
|
1344
|
+
4 100 Enter 108 F5 116 F11 122
|
|
1345
|
+
5 101 - 109 F6 117 F12 123
|
|
1346
|
+
6 102 . 110
|
|
1347
|
+
7 103 / 111
|
|
1348
|
+
|
|
1349
|
+
控制键键码值(keyCode)
|
|
1350
|
+
按键 键码 按键 键码 按键 键码 按键 键码
|
|
1351
|
+
BackSpace 8 Esc 27 → 39 -_ 189
|
|
1352
|
+
Tab 9 Spacebar 32 ↓ 40 .> 190
|
|
1353
|
+
Clear 12 Page Up 33 Insert 45 /? 191
|
|
1354
|
+
Enter 13 Page Down 34 Delete 46 `~ 192
|
|
1355
|
+
Shift 16 End 35 Num Lock 144 [{ 219
|
|
1356
|
+
Control 17 Home 36 ;: 186 \| 220
|
|
1357
|
+
Alt 18 ← 37 =+ 187 ]} 221
|
|
1358
|
+
Cape Lock 20 ↑ 38 ,< 188 '" 222
|
|
1359
|
+
|
|
1360
|
+
多媒体键码值(keyCode)
|
|
1361
|
+
按键 键码
|
|
1362
|
+
音量加 175
|
|
1363
|
+
音量减 174
|
|
1364
|
+
停止 179
|
|
1365
|
+
静音 173
|
|
1366
|
+
浏览器 172
|
|
1367
|
+
邮件 180
|
|
1368
|
+
搜索 170
|
|
1369
|
+
收藏 171
|
|
1370
|
+
**/
|
|
1367
1371
|
listenKeyboard(element, eventName = "keypress", callback, options) {
|
|
1368
|
-
|
|
1372
|
+
const DOMUtilsContext = this;
|
|
1369
1373
|
if (typeof element === "string") {
|
|
1370
1374
|
element = DOMUtilsContext.selectorAll(element);
|
|
1371
1375
|
}
|
|
1372
|
-
|
|
1376
|
+
const keyboardEventCallBack = function (event) {
|
|
1373
1377
|
/** 键名 */
|
|
1374
|
-
|
|
1378
|
+
const keyName = event.key || event.code;
|
|
1375
1379
|
/** 键值 */
|
|
1376
|
-
|
|
1380
|
+
const keyValue = event.charCode || event.keyCode || event.which;
|
|
1377
1381
|
/** 组合键列表 */
|
|
1378
|
-
|
|
1382
|
+
const otherCodeList = [];
|
|
1379
1383
|
if (event.ctrlKey) {
|
|
1380
1384
|
otherCodeList.push("ctrl");
|
|
1381
1385
|
}
|
|
@@ -1413,29 +1417,27 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1413
1417
|
return $ele?.innerHTML?.trim() === "";
|
|
1414
1418
|
});
|
|
1415
1419
|
}
|
|
1416
|
-
else if (selector.match(/[^\s]{1}:contains\("(.*)"\)$/i) ||
|
|
1417
|
-
selector.match(/[^\s]{1}:contains\('(.*)'\)$/i)) {
|
|
1420
|
+
else if (selector.match(/[^\s]{1}:contains\("(.*)"\)$/i) || selector.match(/[^\s]{1}:contains\('(.*)'\)$/i)) {
|
|
1418
1421
|
// contains 语法
|
|
1419
|
-
|
|
1420
|
-
|
|
1422
|
+
const textMatch = selector.match(/:contains\(("|')(.*)("|')\)$/i);
|
|
1423
|
+
const text = textMatch[2];
|
|
1421
1424
|
selector = selector.replace(/:contains\(("|')(.*)("|')\)$/gi, "");
|
|
1422
1425
|
return Array.from(parent.querySelectorAll(selector)).filter(($ele) => {
|
|
1423
1426
|
// @ts-ignore
|
|
1424
1427
|
return ($ele?.textContent || $ele?.innerText)?.includes(text);
|
|
1425
1428
|
});
|
|
1426
1429
|
}
|
|
1427
|
-
else if (selector.match(/[^\s]{1}:regexp\("(.*)"\)$/i) ||
|
|
1428
|
-
selector.match(/[^\s]{1}:regexp\('(.*)'\)$/i)) {
|
|
1430
|
+
else if (selector.match(/[^\s]{1}:regexp\("(.*)"\)$/i) || selector.match(/[^\s]{1}:regexp\('(.*)'\)$/i)) {
|
|
1429
1431
|
// regexp 语法
|
|
1430
|
-
|
|
1432
|
+
const textMatch = selector.match(/:regexp\(("|')(.*)("|')\)$/i);
|
|
1431
1433
|
let pattern = textMatch[2];
|
|
1432
|
-
|
|
1434
|
+
const flagMatch = pattern.match(/("|'),[\s]*("|')([igm]{0,3})$/i);
|
|
1433
1435
|
let flags = "";
|
|
1434
1436
|
if (flagMatch) {
|
|
1435
1437
|
pattern = pattern.replace(/("|'),[\s]*("|')([igm]{0,3})$/gi, "");
|
|
1436
1438
|
flags = flagMatch[3];
|
|
1437
1439
|
}
|
|
1438
|
-
|
|
1440
|
+
const regexp = new RegExp(pattern, flags);
|
|
1439
1441
|
selector = selector.replace(/:regexp\(("|')(.*)("|')\)$/gi, "");
|
|
1440
1442
|
return Array.from(parent.querySelectorAll(selector)).filter(($ele) => {
|
|
1441
1443
|
// @ts-ignore
|
|
@@ -1478,11 +1480,10 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1478
1480
|
selector = selector.replace(/:empty$/gi, "");
|
|
1479
1481
|
return $el.matches(selector) && $el?.innerHTML?.trim() === "";
|
|
1480
1482
|
}
|
|
1481
|
-
else if (selector.match(/[^\s]{1}:contains\("(.*)"\)$/i) ||
|
|
1482
|
-
selector.match(/[^\s]{1}:contains\('(.*)'\)$/i)) {
|
|
1483
|
+
else if (selector.match(/[^\s]{1}:contains\("(.*)"\)$/i) || selector.match(/[^\s]{1}:contains\('(.*)'\)$/i)) {
|
|
1483
1484
|
// contains 语法
|
|
1484
|
-
|
|
1485
|
-
|
|
1485
|
+
const textMatch = selector.match(/:contains\(("|')(.*)("|')\)$/i);
|
|
1486
|
+
const text = textMatch[2];
|
|
1486
1487
|
selector = selector.replace(/:contains\(("|')(.*)("|')\)$/gi, "");
|
|
1487
1488
|
// @ts-ignore
|
|
1488
1489
|
let content = $el?.textContent || $el?.innerText;
|
|
@@ -1491,18 +1492,17 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1491
1492
|
}
|
|
1492
1493
|
return $el.matches(selector) && content?.includes(text);
|
|
1493
1494
|
}
|
|
1494
|
-
else if (selector.match(/[^\s]{1}:regexp\("(.*)"\)$/i) ||
|
|
1495
|
-
selector.match(/[^\s]{1}:regexp\('(.*)'\)$/i)) {
|
|
1495
|
+
else if (selector.match(/[^\s]{1}:regexp\("(.*)"\)$/i) || selector.match(/[^\s]{1}:regexp\('(.*)'\)$/i)) {
|
|
1496
1496
|
// regexp 语法
|
|
1497
|
-
|
|
1497
|
+
const textMatch = selector.match(/:regexp\(("|')(.*)("|')\)$/i);
|
|
1498
1498
|
let pattern = textMatch[2];
|
|
1499
|
-
|
|
1499
|
+
const flagMatch = pattern.match(/("|'),[\s]*("|')([igm]{0,3})$/i);
|
|
1500
1500
|
let flags = "";
|
|
1501
1501
|
if (flagMatch) {
|
|
1502
1502
|
pattern = pattern.replace(/("|'),[\s]*("|')([igm]{0,3})$/gi, "");
|
|
1503
1503
|
flags = flagMatch[3];
|
|
1504
1504
|
}
|
|
1505
|
-
|
|
1505
|
+
const regexp = new RegExp(pattern, flags);
|
|
1506
1506
|
selector = selector.replace(/:regexp\(("|')(.*)("|')\)$/gi, "");
|
|
1507
1507
|
// @ts-ignore
|
|
1508
1508
|
let content = $el?.textContent || $el?.innerText;
|
|
@@ -1521,45 +1521,43 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1521
1521
|
if (selector.match(/[^\s]{1}:empty$/gi)) {
|
|
1522
1522
|
// empty 语法
|
|
1523
1523
|
selector = selector.replace(/:empty$/gi, "");
|
|
1524
|
-
|
|
1524
|
+
const $closest = $el?.closest(selector);
|
|
1525
1525
|
if ($closest && $closest?.innerHTML?.trim() === "") {
|
|
1526
1526
|
return $closest;
|
|
1527
1527
|
}
|
|
1528
1528
|
return null;
|
|
1529
1529
|
}
|
|
1530
|
-
else if (selector.match(/[^\s]{1}:contains\("(.*)"\)$/i) ||
|
|
1531
|
-
selector.match(/[^\s]{1}:contains\('(.*)'\)$/i)) {
|
|
1530
|
+
else if (selector.match(/[^\s]{1}:contains\("(.*)"\)$/i) || selector.match(/[^\s]{1}:contains\('(.*)'\)$/i)) {
|
|
1532
1531
|
// contains 语法
|
|
1533
|
-
|
|
1534
|
-
|
|
1532
|
+
const textMatch = selector.match(/:contains\(("|')(.*)("|')\)$/i);
|
|
1533
|
+
const text = textMatch[2];
|
|
1535
1534
|
selector = selector.replace(/:contains\(("|')(.*)("|')\)$/gi, "");
|
|
1536
|
-
|
|
1535
|
+
const $closest = $el?.closest(selector);
|
|
1537
1536
|
if ($closest) {
|
|
1538
1537
|
// @ts-ignore
|
|
1539
|
-
|
|
1538
|
+
const content = $el?.textContent || $el?.innerText;
|
|
1540
1539
|
if (typeof content === "string" && content.includes(text)) {
|
|
1541
1540
|
return $closest;
|
|
1542
1541
|
}
|
|
1543
1542
|
}
|
|
1544
1543
|
return null;
|
|
1545
1544
|
}
|
|
1546
|
-
else if (selector.match(/[^\s]{1}:regexp\("(.*)"\)$/i) ||
|
|
1547
|
-
selector.match(/[^\s]{1}:regexp\('(.*)'\)$/i)) {
|
|
1545
|
+
else if (selector.match(/[^\s]{1}:regexp\("(.*)"\)$/i) || selector.match(/[^\s]{1}:regexp\('(.*)'\)$/i)) {
|
|
1548
1546
|
// regexp 语法
|
|
1549
|
-
|
|
1547
|
+
const textMatch = selector.match(/:regexp\(("|')(.*)("|')\)$/i);
|
|
1550
1548
|
let pattern = textMatch[2];
|
|
1551
|
-
|
|
1549
|
+
const flagMatch = pattern.match(/("|'),[\s]*("|')([igm]{0,3})$/i);
|
|
1552
1550
|
let flags = "";
|
|
1553
1551
|
if (flagMatch) {
|
|
1554
1552
|
pattern = pattern.replace(/("|'),[\s]*("|')([igm]{0,3})$/gi, "");
|
|
1555
1553
|
flags = flagMatch[3];
|
|
1556
1554
|
}
|
|
1557
|
-
|
|
1555
|
+
const regexp = new RegExp(pattern, flags);
|
|
1558
1556
|
selector = selector.replace(/:regexp\(("|')(.*)("|')\)$/gi, "");
|
|
1559
|
-
|
|
1557
|
+
const $closest = $el?.closest(selector);
|
|
1560
1558
|
if ($closest) {
|
|
1561
1559
|
// @ts-ignore
|
|
1562
|
-
|
|
1560
|
+
const content = $el?.textContent || $el?.innerText;
|
|
1563
1561
|
if (typeof content === "string" && content.match(regexp)) {
|
|
1564
1562
|
return $closest;
|
|
1565
1563
|
}
|
|
@@ -1568,20 +1566,22 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1568
1566
|
}
|
|
1569
1567
|
else {
|
|
1570
1568
|
// 普通语法
|
|
1571
|
-
|
|
1569
|
+
const $closest = $el?.closest(selector);
|
|
1572
1570
|
return $closest;
|
|
1573
1571
|
}
|
|
1574
1572
|
}
|
|
1575
1573
|
}
|
|
1576
1574
|
|
|
1575
|
+
const version = "1.6.6";
|
|
1576
|
+
|
|
1577
1577
|
class DOMUtils extends DOMUtilsEvent {
|
|
1578
1578
|
constructor(option) {
|
|
1579
1579
|
super(option);
|
|
1580
1580
|
}
|
|
1581
1581
|
/** 版本号 */
|
|
1582
|
-
version =
|
|
1582
|
+
version = version;
|
|
1583
1583
|
attr(element, attrName, attrValue) {
|
|
1584
|
-
|
|
1584
|
+
const DOMUtilsContext = this;
|
|
1585
1585
|
if (typeof element === "string") {
|
|
1586
1586
|
element = DOMUtilsContext.selectorAll(element);
|
|
1587
1587
|
}
|
|
@@ -1608,24 +1608,6 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1608
1608
|
element.setAttribute(attrName, attrValue);
|
|
1609
1609
|
}
|
|
1610
1610
|
}
|
|
1611
|
-
/**
|
|
1612
|
-
* 创建元素
|
|
1613
|
-
* @param tagName 标签名
|
|
1614
|
-
* @param property 属性
|
|
1615
|
-
* @param attributes 元素上的自定义属性
|
|
1616
|
-
* @example
|
|
1617
|
-
* // 创建一个DIV元素，且属性class为xxx
|
|
1618
|
-
* DOMUtils.createElement("div",undefined,{ class:"xxx" });
|
|
1619
|
-
* > <div class="xxx"></div>
|
|
1620
|
-
* @example
|
|
1621
|
-
* // 创建一个DIV元素
|
|
1622
|
-
* DOMUtils.createElement("div");
|
|
1623
|
-
* > <div></div>
|
|
1624
|
-
* @example
|
|
1625
|
-
* // 创建一个DIV元素
|
|
1626
|
-
* DOMUtils.createElement("div","测试");
|
|
1627
|
-
* > <div>测试</div>
|
|
1628
|
-
*/
|
|
1629
1611
|
createElement(
|
|
1630
1612
|
/** 元素名 */
|
|
1631
1613
|
tagName,
|
|
@@ -1633,8 +1615,8 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1633
1615
|
property,
|
|
1634
1616
|
/** 自定义属性 */
|
|
1635
1617
|
attributes) {
|
|
1636
|
-
|
|
1637
|
-
|
|
1618
|
+
const DOMUtilsContext = this;
|
|
1619
|
+
const tempElement = DOMUtilsContext.windowApi.document.createElement(tagName);
|
|
1638
1620
|
if (typeof property === "string") {
|
|
1639
1621
|
DOMUtilsContext.html(tempElement, property);
|
|
1640
1622
|
return tempElement;
|
|
@@ -1646,7 +1628,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1646
1628
|
attributes = {};
|
|
1647
1629
|
}
|
|
1648
1630
|
Object.keys(property).forEach((key) => {
|
|
1649
|
-
|
|
1631
|
+
const value = property[key];
|
|
1650
1632
|
if (key === "innerHTML") {
|
|
1651
1633
|
DOMUtilsContext.html(tempElement, value);
|
|
1652
1634
|
return;
|
|
@@ -1668,18 +1650,16 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1668
1650
|
return tempElement;
|
|
1669
1651
|
}
|
|
1670
1652
|
css(element, property, value) {
|
|
1671
|
-
|
|
1653
|
+
const DOMUtilsContext = this;
|
|
1672
1654
|
/**
|
|
1673
1655
|
* 把纯数字没有px的加上
|
|
1674
1656
|
*/
|
|
1675
1657
|
function handlePixe(propertyName, propertyValue) {
|
|
1676
|
-
|
|
1658
|
+
const allowAddPixe = ["width", "height", "top", "left", "right", "bottom", "font-size"];
|
|
1677
1659
|
if (typeof propertyValue === "number") {
|
|
1678
1660
|
propertyValue = propertyValue.toString();
|
|
1679
1661
|
}
|
|
1680
|
-
if (typeof propertyValue === "string" &&
|
|
1681
|
-
allowAddPixe.includes(propertyName) &&
|
|
1682
|
-
propertyValue.match(/[0-9]$/gi)) {
|
|
1662
|
+
if (typeof propertyValue === "string" && allowAddPixe.includes(propertyName) && propertyValue.match(/[0-9]$/gi)) {
|
|
1683
1663
|
propertyValue = propertyValue + "px";
|
|
1684
1664
|
}
|
|
1685
1665
|
return propertyValue;
|
|
@@ -1711,10 +1691,9 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1711
1691
|
});
|
|
1712
1692
|
return;
|
|
1713
1693
|
}
|
|
1714
|
-
else ;
|
|
1715
1694
|
return;
|
|
1716
1695
|
}
|
|
1717
|
-
|
|
1696
|
+
const setStyleProperty = (propertyName, propertyValue) => {
|
|
1718
1697
|
if (typeof propertyValue === "string" && propertyValue.trim().endsWith("!important")) {
|
|
1719
1698
|
propertyValue = propertyValue
|
|
1720
1699
|
.trim()
|
|
@@ -1736,8 +1715,8 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1736
1715
|
}
|
|
1737
1716
|
}
|
|
1738
1717
|
else if (typeof property === "object") {
|
|
1739
|
-
for (
|
|
1740
|
-
|
|
1718
|
+
for (const prop in property) {
|
|
1719
|
+
const value = property[prop];
|
|
1741
1720
|
setStyleProperty(prop, value);
|
|
1742
1721
|
}
|
|
1743
1722
|
}
|
|
@@ -1747,7 +1726,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1747
1726
|
}
|
|
1748
1727
|
}
|
|
1749
1728
|
text(element, text) {
|
|
1750
|
-
|
|
1729
|
+
const DOMUtilsContext = this;
|
|
1751
1730
|
if (typeof element === "string") {
|
|
1752
1731
|
element = DOMUtilsContext.selectorAll(element);
|
|
1753
1732
|
}
|
|
@@ -1783,7 +1762,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1783
1762
|
}
|
|
1784
1763
|
}
|
|
1785
1764
|
html(element, html) {
|
|
1786
|
-
|
|
1765
|
+
const DOMUtilsContext = this;
|
|
1787
1766
|
if (typeof element === "string") {
|
|
1788
1767
|
element = DOMUtilsContext.selectorAll(element);
|
|
1789
1768
|
}
|
|
@@ -1821,19 +1800,19 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1821
1800
|
* 获取移动元素的transform偏移
|
|
1822
1801
|
*/
|
|
1823
1802
|
getTransform(element, isShow = false) {
|
|
1824
|
-
|
|
1803
|
+
const DOMUtilsContext = this;
|
|
1825
1804
|
let transform_left = 0;
|
|
1826
1805
|
let transform_top = 0;
|
|
1827
1806
|
if (!(isShow || (!isShow && DOMUtilsCommonUtils.isShow(element)))) {
|
|
1828
1807
|
/* 未显示 */
|
|
1829
|
-
|
|
1830
|
-
|
|
1808
|
+
const { recovery } = DOMUtilsCommonUtils.showElement(element);
|
|
1809
|
+
const transformInfo = DOMUtilsContext.getTransform(element, true);
|
|
1831
1810
|
recovery();
|
|
1832
1811
|
return transformInfo;
|
|
1833
1812
|
}
|
|
1834
|
-
|
|
1813
|
+
const elementTransform = DOMUtilsContext.windowApi.globalThis.getComputedStyle(element).transform;
|
|
1835
1814
|
if (elementTransform != null && elementTransform !== "none" && elementTransform !== "") {
|
|
1836
|
-
|
|
1815
|
+
const elementTransformSplit = elementTransform.match(/\((.+)\)/)?.[1].split(",");
|
|
1837
1816
|
if (elementTransformSplit) {
|
|
1838
1817
|
transform_left = Math.abs(parseInt(elementTransformSplit[4]));
|
|
1839
1818
|
transform_top = Math.abs(parseInt(elementTransformSplit[5]));
|
|
@@ -1849,7 +1828,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1849
1828
|
};
|
|
1850
1829
|
}
|
|
1851
1830
|
val(element, value) {
|
|
1852
|
-
|
|
1831
|
+
const DOMUtilsContext = this;
|
|
1853
1832
|
if (typeof element === "string") {
|
|
1854
1833
|
element = DOMUtilsContext.selectorAll(element);
|
|
1855
1834
|
}
|
|
@@ -1889,7 +1868,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1889
1868
|
}
|
|
1890
1869
|
}
|
|
1891
1870
|
prop(element, propName, propValue) {
|
|
1892
|
-
|
|
1871
|
+
const DOMUtilsContext = this;
|
|
1893
1872
|
if (typeof element === "string") {
|
|
1894
1873
|
element = DOMUtilsContext.selectorAll(element);
|
|
1895
1874
|
}
|
|
@@ -1931,7 +1910,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1931
1910
|
* DOMUtils.removeAttr("a.xx","data-value")
|
|
1932
1911
|
* */
|
|
1933
1912
|
removeAttr(element, attrName) {
|
|
1934
|
-
|
|
1913
|
+
const DOMUtilsContext = this;
|
|
1935
1914
|
if (typeof element === "string") {
|
|
1936
1915
|
element = DOMUtilsContext.selectorAll(element);
|
|
1937
1916
|
}
|
|
@@ -1957,7 +1936,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1957
1936
|
* DOMUtils.removeClass("a.xx","xx")
|
|
1958
1937
|
*/
|
|
1959
1938
|
removeClass(element, className) {
|
|
1960
|
-
|
|
1939
|
+
const DOMUtilsContext = this;
|
|
1961
1940
|
if (typeof element === "string") {
|
|
1962
1941
|
element = DOMUtilsContext.selectorAll(element);
|
|
1963
1942
|
}
|
|
@@ -1977,7 +1956,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1977
1956
|
}
|
|
1978
1957
|
else {
|
|
1979
1958
|
if (!Array.isArray(className)) {
|
|
1980
|
-
className = className.split(" ");
|
|
1959
|
+
className = className.trim().split(" ");
|
|
1981
1960
|
}
|
|
1982
1961
|
className.forEach((itemClassName) => {
|
|
1983
1962
|
element.classList.remove(itemClassName);
|
|
@@ -1994,7 +1973,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
1994
1973
|
* DOMUtils.removeProp("a.xx","href")
|
|
1995
1974
|
* */
|
|
1996
1975
|
removeProp(element, propName) {
|
|
1997
|
-
|
|
1976
|
+
const DOMUtilsContext = this;
|
|
1998
1977
|
if (typeof element === "string") {
|
|
1999
1978
|
element = DOMUtilsContext.selectorAll(element);
|
|
2000
1979
|
}
|
|
@@ -2020,7 +1999,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2020
1999
|
* DOMUtils.replaceWith("a.xx",'<b class="xx"></b>')
|
|
2021
2000
|
*/
|
|
2022
2001
|
replaceWith(element, newElement) {
|
|
2023
|
-
|
|
2002
|
+
const DOMUtilsContext = this;
|
|
2024
2003
|
if (typeof element === "string") {
|
|
2025
2004
|
element = DOMUtilsContext.selectorAll(element);
|
|
2026
2005
|
}
|
|
@@ -2037,7 +2016,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2037
2016
|
if (typeof newElement === "string") {
|
|
2038
2017
|
newElement = DOMUtilsContext.parseHTML(newElement, false, false);
|
|
2039
2018
|
}
|
|
2040
|
-
|
|
2019
|
+
const $parent = element.parentElement;
|
|
2041
2020
|
if ($parent) {
|
|
2042
2021
|
$parent.replaceChild(newElement, element);
|
|
2043
2022
|
}
|
|
@@ -2056,7 +2035,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2056
2035
|
* DOMUtils.addClass("a.xx","_vue_")
|
|
2057
2036
|
* */
|
|
2058
2037
|
addClass(element, className) {
|
|
2059
|
-
|
|
2038
|
+
const DOMUtilsContext = this;
|
|
2060
2039
|
if (typeof element === "string") {
|
|
2061
2040
|
element = DOMUtilsContext.selectorAll(element);
|
|
2062
2041
|
}
|
|
@@ -2086,7 +2065,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2086
2065
|
* @param className
|
|
2087
2066
|
*/
|
|
2088
2067
|
hasClass(element, className) {
|
|
2089
|
-
|
|
2068
|
+
const DOMUtilsContext = this;
|
|
2090
2069
|
if (typeof element === "string") {
|
|
2091
2070
|
element = DOMUtilsContext.selectorAll(element);
|
|
2092
2071
|
}
|
|
@@ -2125,7 +2104,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2125
2104
|
* DOMUtils.append("a.xx","'<b class="xx"></b>")
|
|
2126
2105
|
* */
|
|
2127
2106
|
append(element, content) {
|
|
2128
|
-
|
|
2107
|
+
const DOMUtilsContext = this;
|
|
2129
2108
|
if (typeof element === "string") {
|
|
2130
2109
|
element = DOMUtilsContext.selectorAll(element);
|
|
2131
2110
|
}
|
|
@@ -2157,7 +2136,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2157
2136
|
}
|
|
2158
2137
|
if (Array.isArray(content) || content instanceof NodeList) {
|
|
2159
2138
|
/* 数组 */
|
|
2160
|
-
|
|
2139
|
+
const fragment = DOMUtilsContext.windowApi.document.createDocumentFragment();
|
|
2161
2140
|
content.forEach((ele) => {
|
|
2162
2141
|
if (typeof ele === "string") {
|
|
2163
2142
|
// 转为元素
|
|
@@ -2181,7 +2160,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2181
2160
|
* DOMUtils.prepend("a.xx","'<b class="xx"></b>")
|
|
2182
2161
|
* */
|
|
2183
2162
|
prepend(element, content) {
|
|
2184
|
-
|
|
2163
|
+
const DOMUtilsContext = this;
|
|
2185
2164
|
if (typeof element === "string") {
|
|
2186
2165
|
element = DOMUtilsContext.selectorAll(element);
|
|
2187
2166
|
}
|
|
@@ -2205,7 +2184,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2205
2184
|
}
|
|
2206
2185
|
}
|
|
2207
2186
|
else {
|
|
2208
|
-
|
|
2187
|
+
const $firstChild = element.firstChild;
|
|
2209
2188
|
if ($firstChild == null) {
|
|
2210
2189
|
element.prepend(content);
|
|
2211
2190
|
}
|
|
@@ -2224,7 +2203,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2224
2203
|
* DOMUtils.after("a.xx","'<b class="xx"></b>")
|
|
2225
2204
|
* */
|
|
2226
2205
|
after(element, content) {
|
|
2227
|
-
|
|
2206
|
+
const DOMUtilsContext = this;
|
|
2228
2207
|
if (typeof element === "string") {
|
|
2229
2208
|
element = DOMUtilsContext.selectorAll(element);
|
|
2230
2209
|
}
|
|
@@ -2242,8 +2221,8 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2242
2221
|
element.insertAdjacentHTML("afterend", DOMUtilsCommonUtils.getSafeHTML(content));
|
|
2243
2222
|
}
|
|
2244
2223
|
else {
|
|
2245
|
-
|
|
2246
|
-
|
|
2224
|
+
const $parent = element.parentElement;
|
|
2225
|
+
const $nextSlibling = element.nextSibling;
|
|
2247
2226
|
if (!$parent || $nextSlibling) {
|
|
2248
2227
|
// 任意一个不行
|
|
2249
2228
|
element.after(content);
|
|
@@ -2263,7 +2242,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2263
2242
|
* DOMUtils.before("a.xx","'<b class="xx"></b>")
|
|
2264
2243
|
* */
|
|
2265
2244
|
before(element, content) {
|
|
2266
|
-
|
|
2245
|
+
const DOMUtilsContext = this;
|
|
2267
2246
|
if (typeof element === "string") {
|
|
2268
2247
|
element = DOMUtilsContext.selectorAll(element);
|
|
2269
2248
|
}
|
|
@@ -2281,7 +2260,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2281
2260
|
element.insertAdjacentHTML("beforebegin", DOMUtilsCommonUtils.getSafeHTML(content));
|
|
2282
2261
|
}
|
|
2283
2262
|
else {
|
|
2284
|
-
|
|
2263
|
+
const $parent = element.parentElement;
|
|
2285
2264
|
if (!$parent) {
|
|
2286
2265
|
element.before(content);
|
|
2287
2266
|
}
|
|
@@ -2300,7 +2279,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2300
2279
|
* DOMUtils.remove("a.xx")
|
|
2301
2280
|
* */
|
|
2302
2281
|
remove(element) {
|
|
2303
|
-
|
|
2282
|
+
const DOMUtilsContext = this;
|
|
2304
2283
|
if (typeof element === "string") {
|
|
2305
2284
|
element = DOMUtilsContext.selectorAll(element);
|
|
2306
2285
|
}
|
|
@@ -2332,7 +2311,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2332
2311
|
* DOMUtils.empty("a.xx")
|
|
2333
2312
|
* */
|
|
2334
2313
|
empty(element) {
|
|
2335
|
-
|
|
2314
|
+
const DOMUtilsContext = this;
|
|
2336
2315
|
if (typeof element === "string") {
|
|
2337
2316
|
element = DOMUtilsContext.selectorAll(element);
|
|
2338
2317
|
}
|
|
@@ -2363,14 +2342,14 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2363
2342
|
* > 0
|
|
2364
2343
|
*/
|
|
2365
2344
|
offset(element) {
|
|
2366
|
-
|
|
2345
|
+
const DOMUtilsContext = this;
|
|
2367
2346
|
if (typeof element === "string") {
|
|
2368
2347
|
element = DOMUtilsContext.selector(element);
|
|
2369
2348
|
}
|
|
2370
2349
|
if (element == null) {
|
|
2371
2350
|
return;
|
|
2372
2351
|
}
|
|
2373
|
-
|
|
2352
|
+
const rect = element.getBoundingClientRect();
|
|
2374
2353
|
return {
|
|
2375
2354
|
/** y轴偏移 */
|
|
2376
2355
|
top: rect.top + DOMUtilsContext.windowApi.globalThis.scrollY,
|
|
@@ -2379,14 +2358,10 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2379
2358
|
};
|
|
2380
2359
|
}
|
|
2381
2360
|
width(element, isShow = false) {
|
|
2382
|
-
|
|
2361
|
+
const DOMUtilsContext = this;
|
|
2383
2362
|
if (typeof element === "string") {
|
|
2384
2363
|
element = DOMUtilsContext.selector(element);
|
|
2385
2364
|
}
|
|
2386
|
-
if (element == null) {
|
|
2387
|
-
// @ts-ignore
|
|
2388
|
-
return;
|
|
2389
|
-
}
|
|
2390
2365
|
if (DOMUtilsCommonUtils.isWin(element)) {
|
|
2391
2366
|
return DOMUtilsContext.windowApi.window.document.documentElement.clientWidth;
|
|
2392
2367
|
}
|
|
@@ -2405,11 +2380,11 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2405
2380
|
}
|
|
2406
2381
|
/* 如果从css里获取到的值不是大于0 可能是auto 则通过offsetWidth来进行计算 */
|
|
2407
2382
|
if (element.offsetWidth > 0) {
|
|
2408
|
-
|
|
2409
|
-
|
|
2410
|
-
|
|
2411
|
-
|
|
2412
|
-
|
|
2383
|
+
const borderLeftWidth = DOMUtilsCommonUtils.getStyleValue(element, "borderLeftWidth");
|
|
2384
|
+
const borderRightWidth = DOMUtilsCommonUtils.getStyleValue(element, "borderRightWidth");
|
|
2385
|
+
const paddingLeft = DOMUtilsCommonUtils.getStyleValue(element, "paddingLeft");
|
|
2386
|
+
const paddingRight = DOMUtilsCommonUtils.getStyleValue(element, "paddingRight");
|
|
2387
|
+
const backHeight = parseFloat(element.offsetWidth.toString()) -
|
|
2413
2388
|
parseFloat(borderLeftWidth.toString()) -
|
|
2414
2389
|
parseFloat(borderRightWidth.toString()) -
|
|
2415
2390
|
parseFloat(paddingLeft.toString()) -
|
|
@@ -2421,24 +2396,20 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2421
2396
|
else {
|
|
2422
2397
|
/* 未显示 */
|
|
2423
2398
|
element = element;
|
|
2424
|
-
|
|
2425
|
-
|
|
2399
|
+
const { recovery } = DOMUtilsCommonUtils.showElement(element);
|
|
2400
|
+
const width = DOMUtilsContext.width(element, true);
|
|
2426
2401
|
recovery();
|
|
2427
2402
|
return width;
|
|
2428
2403
|
}
|
|
2429
2404
|
}
|
|
2430
2405
|
height(element, isShow = false) {
|
|
2431
|
-
|
|
2406
|
+
const DOMUtilsContext = this;
|
|
2432
2407
|
if (DOMUtilsCommonUtils.isWin(element)) {
|
|
2433
2408
|
return DOMUtilsContext.windowApi.window.document.documentElement.clientHeight;
|
|
2434
2409
|
}
|
|
2435
2410
|
if (typeof element === "string") {
|
|
2436
2411
|
element = DOMUtilsContext.selector(element);
|
|
2437
2412
|
}
|
|
2438
|
-
if (element == null) {
|
|
2439
|
-
// @ts-ignore
|
|
2440
|
-
return;
|
|
2441
|
-
}
|
|
2442
2413
|
if (element.nodeType === 9) {
|
|
2443
2414
|
element = element;
|
|
2444
2415
|
/* Document文档节点 */
|
|
@@ -2454,11 +2425,11 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2454
2425
|
}
|
|
2455
2426
|
/* 如果从css里获取到的值不是大于0 可能是auto 则通过offsetHeight来进行计算 */
|
|
2456
2427
|
if (element.offsetHeight > 0) {
|
|
2457
|
-
|
|
2458
|
-
|
|
2459
|
-
|
|
2460
|
-
|
|
2461
|
-
|
|
2428
|
+
const borderTopWidth = DOMUtilsCommonUtils.getStyleValue(element, "borderTopWidth");
|
|
2429
|
+
const borderBottomWidth = DOMUtilsCommonUtils.getStyleValue(element, "borderBottomWidth");
|
|
2430
|
+
const paddingTop = DOMUtilsCommonUtils.getStyleValue(element, "paddingTop");
|
|
2431
|
+
const paddingBottom = DOMUtilsCommonUtils.getStyleValue(element, "paddingBottom");
|
|
2432
|
+
const backHeight = parseFloat(element.offsetHeight.toString()) -
|
|
2462
2433
|
parseFloat(borderTopWidth.toString()) -
|
|
2463
2434
|
parseFloat(borderBottomWidth.toString()) -
|
|
2464
2435
|
parseFloat(paddingTop.toString()) -
|
|
@@ -2470,60 +2441,52 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2470
2441
|
else {
|
|
2471
2442
|
/* 未显示 */
|
|
2472
2443
|
element = element;
|
|
2473
|
-
|
|
2474
|
-
|
|
2444
|
+
const { recovery } = DOMUtilsCommonUtils.showElement(element);
|
|
2445
|
+
const height = DOMUtilsContext.height(element, true);
|
|
2475
2446
|
recovery();
|
|
2476
2447
|
return height;
|
|
2477
2448
|
}
|
|
2478
2449
|
}
|
|
2479
2450
|
outerWidth(element, isShow = false) {
|
|
2480
|
-
|
|
2451
|
+
const DOMUtilsContext = this;
|
|
2481
2452
|
if (DOMUtilsCommonUtils.isWin(element)) {
|
|
2482
2453
|
return DOMUtilsContext.windowApi.window.innerWidth;
|
|
2483
2454
|
}
|
|
2484
2455
|
if (typeof element === "string") {
|
|
2485
2456
|
element = DOMUtilsContext.selector(element);
|
|
2486
2457
|
}
|
|
2487
|
-
if (element == null) {
|
|
2488
|
-
// @ts-ignore
|
|
2489
|
-
return;
|
|
2490
|
-
}
|
|
2491
2458
|
element = element;
|
|
2492
2459
|
if (isShow || (!isShow && DOMUtilsCommonUtils.isShow(element))) {
|
|
2493
|
-
|
|
2494
|
-
|
|
2495
|
-
|
|
2460
|
+
const style = DOMUtilsContext.windowApi.globalThis.getComputedStyle(element, null);
|
|
2461
|
+
const marginLeft = DOMUtilsCommonUtils.getStyleValue(style, "marginLeft");
|
|
2462
|
+
const marginRight = DOMUtilsCommonUtils.getStyleValue(style, "marginRight");
|
|
2496
2463
|
return element.offsetWidth + marginLeft + marginRight;
|
|
2497
2464
|
}
|
|
2498
2465
|
else {
|
|
2499
|
-
|
|
2500
|
-
|
|
2466
|
+
const { recovery } = DOMUtilsCommonUtils.showElement(element);
|
|
2467
|
+
const outerWidth = DOMUtilsContext.outerWidth(element, true);
|
|
2501
2468
|
recovery();
|
|
2502
2469
|
return outerWidth;
|
|
2503
2470
|
}
|
|
2504
2471
|
}
|
|
2505
2472
|
outerHeight(element, isShow = false) {
|
|
2506
|
-
|
|
2473
|
+
const DOMUtilsContext = this;
|
|
2507
2474
|
if (DOMUtilsCommonUtils.isWin(element)) {
|
|
2508
2475
|
return DOMUtilsContext.windowApi.window.innerHeight;
|
|
2509
2476
|
}
|
|
2510
2477
|
if (typeof element === "string") {
|
|
2511
2478
|
element = DOMUtilsContext.selector(element);
|
|
2512
2479
|
}
|
|
2513
|
-
if (element == null) {
|
|
2514
|
-
// @ts-ignore
|
|
2515
|
-
return;
|
|
2516
|
-
}
|
|
2517
2480
|
element = element;
|
|
2518
2481
|
if (isShow || (!isShow && DOMUtilsCommonUtils.isShow(element))) {
|
|
2519
|
-
|
|
2520
|
-
|
|
2521
|
-
|
|
2482
|
+
const style = DOMUtilsContext.windowApi.globalThis.getComputedStyle(element, null);
|
|
2483
|
+
const marginTop = DOMUtilsCommonUtils.getStyleValue(style, "marginTop");
|
|
2484
|
+
const marginBottom = DOMUtilsCommonUtils.getStyleValue(style, "marginBottom");
|
|
2522
2485
|
return element.offsetHeight + marginTop + marginBottom;
|
|
2523
2486
|
}
|
|
2524
2487
|
else {
|
|
2525
|
-
|
|
2526
|
-
|
|
2488
|
+
const { recovery } = DOMUtilsCommonUtils.showElement(element);
|
|
2489
|
+
const outerHeight = DOMUtilsContext.outerHeight(element, true);
|
|
2527
2490
|
recovery();
|
|
2528
2491
|
return outerHeight;
|
|
2529
2492
|
}
|
|
@@ -2541,7 +2504,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2541
2504
|
* })
|
|
2542
2505
|
*/
|
|
2543
2506
|
animate(element, styles, duration = 1000, callback = null) {
|
|
2544
|
-
|
|
2507
|
+
const DOMUtilsContext = this;
|
|
2545
2508
|
if (typeof element === "string") {
|
|
2546
2509
|
element = DOMUtilsContext.selectorAll(element);
|
|
2547
2510
|
}
|
|
@@ -2567,21 +2530,20 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2567
2530
|
if (Object.keys(styles).length === 0) {
|
|
2568
2531
|
throw new Error("styles must contain at least one property");
|
|
2569
2532
|
}
|
|
2570
|
-
|
|
2571
|
-
|
|
2572
|
-
|
|
2573
|
-
for (
|
|
2574
|
-
from[prop] =
|
|
2575
|
-
element.style[prop] || DOMUtilsContext.windowApi.globalThis.getComputedStyle(element)[prop];
|
|
2533
|
+
const start = performance.now();
|
|
2534
|
+
const from = {};
|
|
2535
|
+
const to = {};
|
|
2536
|
+
for (const prop in styles) {
|
|
2537
|
+
from[prop] = element.style[prop] || DOMUtilsContext.windowApi.globalThis.getComputedStyle(element)[prop];
|
|
2576
2538
|
to[prop] = styles[prop];
|
|
2577
2539
|
}
|
|
2578
|
-
|
|
2579
|
-
|
|
2540
|
+
const timer = DOMUtilsCommonUtils.setInterval(function () {
|
|
2541
|
+
const timePassed = performance.now() - start;
|
|
2580
2542
|
let progress = timePassed / duration;
|
|
2581
2543
|
if (progress > 1) {
|
|
2582
2544
|
progress = 1;
|
|
2583
2545
|
}
|
|
2584
|
-
for (
|
|
2546
|
+
for (const prop in styles) {
|
|
2585
2547
|
element.style[prop] = from[prop] + (to[prop] - from[prop]) * progress + "px";
|
|
2586
2548
|
}
|
|
2587
2549
|
if (progress === 1) {
|
|
@@ -2601,7 +2563,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2601
2563
|
* DOMUtils.wrap(document.querySelector("a.xx"),"<div></div>")
|
|
2602
2564
|
*/
|
|
2603
2565
|
wrap(element, wrapperHTML) {
|
|
2604
|
-
|
|
2566
|
+
const DOMUtilsContext = this;
|
|
2605
2567
|
if (typeof element === "string") {
|
|
2606
2568
|
element = DOMUtilsContext.selectorAll(element);
|
|
2607
2569
|
}
|
|
@@ -2617,17 +2579,17 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2617
2579
|
}
|
|
2618
2580
|
element = element;
|
|
2619
2581
|
// 创建一个新的div元素，并将wrapperHTML作为其innerHTML
|
|
2620
|
-
|
|
2582
|
+
const wrapper = DOMUtilsContext.windowApi.document.createElement("div");
|
|
2621
2583
|
DOMUtilsContext.html(wrapper, wrapperHTML);
|
|
2622
|
-
|
|
2584
|
+
const wrapperFirstChild = wrapper.firstChild;
|
|
2623
2585
|
// 将要包裹的元素插入目标元素前面
|
|
2624
|
-
|
|
2586
|
+
const parentElement = element.parentElement;
|
|
2625
2587
|
parentElement.insertBefore(wrapperFirstChild, element);
|
|
2626
2588
|
// 将要包裹的元素移动到wrapper中
|
|
2627
2589
|
wrapperFirstChild.appendChild(element);
|
|
2628
2590
|
}
|
|
2629
2591
|
prev(element) {
|
|
2630
|
-
|
|
2592
|
+
const DOMUtilsContext = this;
|
|
2631
2593
|
if (typeof element === "string") {
|
|
2632
2594
|
element = DOMUtilsContext.selector(element);
|
|
2633
2595
|
}
|
|
@@ -2637,7 +2599,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2637
2599
|
return element.previousElementSibling;
|
|
2638
2600
|
}
|
|
2639
2601
|
next(element) {
|
|
2640
|
-
|
|
2602
|
+
const DOMUtilsContext = this;
|
|
2641
2603
|
if (typeof element === "string") {
|
|
2642
2604
|
element = DOMUtilsContext.selector(element);
|
|
2643
2605
|
}
|
|
@@ -2652,7 +2614,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2652
2614
|
* let DOMUtils = window.DOMUtils.noConflict()
|
|
2653
2615
|
*/
|
|
2654
2616
|
noConflict() {
|
|
2655
|
-
|
|
2617
|
+
const DOMUtilsContext = this;
|
|
2656
2618
|
if (DOMUtilsContext.windowApi.window.DOMUtils) {
|
|
2657
2619
|
DOMUtilsCommonUtils.delete(window, "DOMUtils");
|
|
2658
2620
|
}
|
|
@@ -2660,7 +2622,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2660
2622
|
return this;
|
|
2661
2623
|
}
|
|
2662
2624
|
siblings(element) {
|
|
2663
|
-
|
|
2625
|
+
const DOMUtilsContext = this;
|
|
2664
2626
|
if (typeof element === "string") {
|
|
2665
2627
|
element = DOMUtilsContext.selector(element);
|
|
2666
2628
|
}
|
|
@@ -2680,7 +2642,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2680
2642
|
* > <div ...>....</div>
|
|
2681
2643
|
*/
|
|
2682
2644
|
parent(element) {
|
|
2683
|
-
|
|
2645
|
+
const DOMUtilsContext = this;
|
|
2684
2646
|
if (typeof element === "string") {
|
|
2685
2647
|
element = DOMUtilsContext.selector(element);
|
|
2686
2648
|
}
|
|
@@ -2688,7 +2650,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2688
2650
|
return;
|
|
2689
2651
|
}
|
|
2690
2652
|
if (DOMUtilsCommonUtils.isNodeList(element)) {
|
|
2691
|
-
|
|
2653
|
+
const resultArray = [];
|
|
2692
2654
|
element.forEach(($ele) => {
|
|
2693
2655
|
resultArray.push(DOMUtilsContext.parent($ele));
|
|
2694
2656
|
});
|
|
@@ -2699,11 +2661,11 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2699
2661
|
}
|
|
2700
2662
|
}
|
|
2701
2663
|
parseHTML(html, useParser = false, isComplete = false) {
|
|
2702
|
-
|
|
2664
|
+
const DOMUtilsContext = this;
|
|
2703
2665
|
// 去除html前后的空格
|
|
2704
2666
|
html = html.trim();
|
|
2705
2667
|
function parseHTMLByDOMParser() {
|
|
2706
|
-
|
|
2668
|
+
const parser = new DOMParser();
|
|
2707
2669
|
if (isComplete) {
|
|
2708
2670
|
return parser.parseFromString(html, "text/html");
|
|
2709
2671
|
}
|
|
@@ -2712,7 +2674,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2712
2674
|
}
|
|
2713
2675
|
}
|
|
2714
2676
|
function parseHTMLByCreateDom() {
|
|
2715
|
-
|
|
2677
|
+
const tempDIV = DOMUtilsContext.windowApi.document.createElement("div");
|
|
2716
2678
|
DOMUtilsContext.html(tempDIV, html);
|
|
2717
2679
|
if (isComplete) {
|
|
2718
2680
|
return tempDIV;
|
|
@@ -2737,7 +2699,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2737
2699
|
*/
|
|
2738
2700
|
serialize($form) {
|
|
2739
2701
|
const elements = $form.elements;
|
|
2740
|
-
|
|
2702
|
+
const serializedArray = [];
|
|
2741
2703
|
for (let i = 0; i < elements.length; i++) {
|
|
2742
2704
|
const element = elements[i];
|
|
2743
2705
|
if (element.name &&
|
|
@@ -2776,7 +2738,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2776
2738
|
* DOMUtils.show("a.xx")
|
|
2777
2739
|
*/
|
|
2778
2740
|
show(target, checkVisiblie = true) {
|
|
2779
|
-
|
|
2741
|
+
const DOMUtilsContext = this;
|
|
2780
2742
|
if (target == null) {
|
|
2781
2743
|
return;
|
|
2782
2744
|
}
|
|
@@ -2813,7 +2775,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2813
2775
|
* DOMUtils.hide("a.xx")
|
|
2814
2776
|
*/
|
|
2815
2777
|
hide(target, checkVisiblie = true) {
|
|
2816
|
-
|
|
2778
|
+
const DOMUtilsContext = this;
|
|
2817
2779
|
if (target == null) {
|
|
2818
2780
|
return;
|
|
2819
2781
|
}
|
|
@@ -2855,7 +2817,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2855
2817
|
if (element == null) {
|
|
2856
2818
|
return;
|
|
2857
2819
|
}
|
|
2858
|
-
|
|
2820
|
+
const DOMUtilsContext = this;
|
|
2859
2821
|
if (typeof element === "string") {
|
|
2860
2822
|
element = DOMUtilsContext.selectorAll(element);
|
|
2861
2823
|
}
|
|
@@ -2873,7 +2835,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2873
2835
|
function step(timestamp) {
|
|
2874
2836
|
if (!start)
|
|
2875
2837
|
start = timestamp;
|
|
2876
|
-
|
|
2838
|
+
const progress = timestamp - start;
|
|
2877
2839
|
element = element;
|
|
2878
2840
|
element.style.opacity = Math.min(progress / duration, 1).toString();
|
|
2879
2841
|
if (progress < duration) {
|
|
@@ -2903,7 +2865,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2903
2865
|
* })
|
|
2904
2866
|
*/
|
|
2905
2867
|
fadeOut(element, duration = 400, callback) {
|
|
2906
|
-
|
|
2868
|
+
const DOMUtilsContext = this;
|
|
2907
2869
|
if (element == null) {
|
|
2908
2870
|
return;
|
|
2909
2871
|
}
|
|
@@ -2923,7 +2885,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2923
2885
|
function step(timestamp) {
|
|
2924
2886
|
if (!start)
|
|
2925
2887
|
start = timestamp;
|
|
2926
|
-
|
|
2888
|
+
const progress = timestamp - start;
|
|
2927
2889
|
element = element;
|
|
2928
2890
|
element.style.opacity = Math.max(1 - progress / duration, 0).toString();
|
|
2929
2891
|
if (progress < duration) {
|
|
@@ -2949,7 +2911,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2949
2911
|
* DOMUtils.toggle("a.xx")
|
|
2950
2912
|
*/
|
|
2951
2913
|
toggle(element, checkVisiblie) {
|
|
2952
|
-
|
|
2914
|
+
const DOMUtilsContext = this;
|
|
2953
2915
|
if (typeof element === "string") {
|
|
2954
2916
|
element = DOMUtilsContext.selectorAll(element);
|
|
2955
2917
|
}
|
|
@@ -2987,7 +2949,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
2987
2949
|
* DOMUtils.getTextBoundingRect(document.querySelector("input"));
|
|
2988
2950
|
*/
|
|
2989
2951
|
getTextBoundingRect($input, selectionStart, selectionEnd) {
|
|
2990
|
-
|
|
2952
|
+
const DOMUtilsContext = this;
|
|
2991
2953
|
// Basic parameter validation
|
|
2992
2954
|
if (!$input || !("value" in $input))
|
|
2993
2955
|
return $input;
|
|
@@ -3016,18 +2978,20 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
3016
2978
|
else
|
|
3017
2979
|
selectionEnd = Math.min($input.value.length, selectionEnd);
|
|
3018
2980
|
// If available (thus IE), use the createTextRange method
|
|
3019
|
-
// @ts-ignore
|
|
3020
2981
|
if (typeof $input.createTextRange == "function") {
|
|
3021
|
-
|
|
2982
|
+
const range = $input.createTextRange();
|
|
3022
2983
|
range.collapse(true);
|
|
3023
2984
|
range.moveStart("character", selectionStart);
|
|
3024
2985
|
range.moveEnd("character", selectionEnd - selectionStart);
|
|
3025
2986
|
return range.getBoundingClientRect();
|
|
3026
2987
|
}
|
|
3027
2988
|
// createTextRange is not supported, create a fake text range
|
|
3028
|
-
|
|
2989
|
+
const offset = getInputOffset(), width = getInputCSS("width", true), height = getInputCSS("height", true);
|
|
2990
|
+
let topPos = offset.top;
|
|
2991
|
+
let leftPos = offset.left;
|
|
3029
2992
|
// Styles to simulate a node in an input field
|
|
3030
|
-
let cssDefaultStyles = "white-space:pre;padding:0;margin:0;"
|
|
2993
|
+
let cssDefaultStyles = "white-space:pre;padding:0;margin:0;";
|
|
2994
|
+
const listOfModifiers = [
|
|
3031
2995
|
"direction",
|
|
3032
2996
|
"font-family",
|
|
3033
2997
|
"font-size",
|
|
@@ -3049,16 +3013,15 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
3049
3013
|
leftPos += getInputCSS("border-left-width", true);
|
|
3050
3014
|
leftPos += 1; //Seems to be necessary
|
|
3051
3015
|
for (let index = 0; index < listOfModifiers.length; index++) {
|
|
3052
|
-
|
|
3053
|
-
|
|
3054
|
-
cssDefaultStyles += property + ":" + getInputCSS(property) + ";";
|
|
3016
|
+
const property = listOfModifiers[index];
|
|
3017
|
+
cssDefaultStyles += property + ":" + getInputCSS(property, false) + ";";
|
|
3055
3018
|
}
|
|
3056
3019
|
// End of CSS variable checks
|
|
3057
3020
|
// 不能为空，不然获取不到高度
|
|
3058
|
-
|
|
3021
|
+
const text = $input.value || "G", textLen = text.length, fakeClone = DOMUtilsContext.windowApi.document.createElement("div");
|
|
3059
3022
|
if (selectionStart > 0)
|
|
3060
3023
|
appendPart(0, selectionStart);
|
|
3061
|
-
|
|
3024
|
+
const fakeRange = appendPart(selectionStart, selectionEnd);
|
|
3062
3025
|
if (textLen > selectionEnd)
|
|
3063
3026
|
appendPart(selectionEnd, textLen);
|
|
3064
3027
|
// Styles to inherit the font styles of the element
|
|
@@ -3070,7 +3033,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
3070
3033
|
fakeClone.style.width = width + "px";
|
|
3071
3034
|
fakeClone.style.height = height + "px";
|
|
3072
3035
|
DOMUtilsContext.windowApi.document.body.appendChild(fakeClone);
|
|
3073
|
-
|
|
3036
|
+
const returnValue = fakeRange.getBoundingClientRect(); //Get rect
|
|
3074
3037
|
fakeClone?.parentNode?.removeChild(fakeClone); //Remove temp
|
|
3075
3038
|
return returnValue;
|
|
3076
3039
|
// Local functions for readability of the previous code
|
|
@@ -3081,7 +3044,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
3081
3044
|
* @returns
|
|
3082
3045
|
*/
|
|
3083
3046
|
function appendPart(start, end) {
|
|
3084
|
-
|
|
3047
|
+
const span = DOMUtilsContext.windowApi.document.createElement("span");
|
|
3085
3048
|
span.style.cssText = cssDefaultStyles; //Force styles to prevent unexpected results
|
|
3086
3049
|
span.textContent = text.substring(start, end);
|
|
3087
3050
|
fakeClone.appendChild(span);
|
|
@@ -3089,13 +3052,13 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
3089
3052
|
}
|
|
3090
3053
|
// Computing offset position
|
|
3091
3054
|
function getInputOffset() {
|
|
3092
|
-
|
|
3055
|
+
const body = DOMUtilsContext.windowApi.document.body, win = DOMUtilsContext.windowApi.document.defaultView, docElem = DOMUtilsContext.windowApi.document.documentElement, $box = DOMUtilsContext.windowApi.document.createElement("div");
|
|
3093
3056
|
$box.style.paddingLeft = $box.style.width = "1px";
|
|
3094
3057
|
body.appendChild($box);
|
|
3095
|
-
|
|
3058
|
+
const isBoxModel = $box.offsetWidth == 2;
|
|
3096
3059
|
body.removeChild($box);
|
|
3097
|
-
|
|
3098
|
-
|
|
3060
|
+
const $boxRect = $input.getBoundingClientRect();
|
|
3061
|
+
const clientTop = docElem.clientTop || body.clientTop || 0, clientLeft = docElem.clientLeft || body.clientLeft || 0, scrollTop = win.pageYOffset || (isBoxModel && docElem.scrollTop) || body.scrollTop, scrollLeft = win.pageXOffset || (isBoxModel && docElem.scrollLeft) || body.scrollLeft;
|
|
3099
3062
|
return {
|
|
3100
3063
|
top: $boxRect.top + scrollTop - clientTop,
|
|
3101
3064
|
left: $boxRect.left + scrollLeft - clientLeft,
|
|
@@ -3108,10 +3071,13 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
3108
3071
|
* @returns
|
|
3109
3072
|
*/
|
|
3110
3073
|
function getInputCSS(prop, isNumber) {
|
|
3111
|
-
|
|
3112
|
-
|
|
3113
|
-
|
|
3114
|
-
|
|
3074
|
+
const val = DOMUtilsContext.windowApi.document.defaultView.getComputedStyle($input, null).getPropertyValue(prop);
|
|
3075
|
+
if (isNumber) {
|
|
3076
|
+
return parseFloat(val);
|
|
3077
|
+
}
|
|
3078
|
+
else {
|
|
3079
|
+
return val;
|
|
3080
|
+
}
|
|
3115
3081
|
}
|
|
3116
3082
|
}
|
|
3117
3083
|
/** 获取 animationend 在各个浏览器的兼容名 */
|
|
@@ -3123,7 +3089,7 @@ System.register('DOMUtils', [], (function (exports) {
|
|
|
3123
3089
|
return DOMUtilsCommonUtils.getTransitionEndNameList();
|
|
3124
3090
|
}
|
|
3125
3091
|
}
|
|
3126
|
-
|
|
3092
|
+
const domUtils = exports("default", new DOMUtils());
|
|
3127
3093
|
|
|
3128
3094
|
})
|
|
3129
3095
|
};
|