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