@whitesev/domutils 1.4.3 → 1.4.5

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.
@@ -179,8 +179,9 @@ var DOMUtils = (function () {
179
179
  * @param option
180
180
  */
181
181
  function getOption(args, startIndex, option) {
182
- if (typeof args[startIndex] === "boolean") {
183
- option.capture = args[startIndex];
182
+ let currentParam = args[startIndex];
183
+ if (typeof currentParam === "boolean") {
184
+ option.capture = currentParam;
184
185
  if (typeof args[startIndex + 1] === "boolean") {
185
186
  option.once = args[startIndex + 1];
186
187
  }
@@ -188,13 +189,15 @@ var DOMUtils = (function () {
188
189
  option.passive = args[startIndex + 2];
189
190
  }
190
191
  }
191
- else if (typeof args[startIndex] === "object" &&
192
- ("capture" in args[startIndex] ||
193
- "once" in args[startIndex] ||
194
- "passive" in args[startIndex])) {
195
- option.capture = args[startIndex].capture;
196
- option.once = args[startIndex].once;
197
- option.passive = args[startIndex].passive;
192
+ else if (typeof currentParam === "object" &&
193
+ ("capture" in currentParam ||
194
+ "once" in currentParam ||
195
+ "passive" in currentParam ||
196
+ "isComposedPath" in currentParam)) {
197
+ option.capture = currentParam.capture;
198
+ option.once = currentParam.once;
199
+ option.passive = currentParam.passive;
200
+ option.isComposedPath = currentParam.isComposedPath;
198
201
  }
199
202
  return option;
200
203
  }
@@ -231,27 +234,28 @@ var DOMUtils = (function () {
231
234
  selectorList.push(selector);
232
235
  }
233
236
  // 事件回调
234
- let _callback_ = callback;
237
+ let listenerCallBack = callback;
235
238
  // 事件配置
236
- let _option_ = {
239
+ let listenerOption = {
237
240
  capture: false,
238
241
  once: false,
239
242
  passive: false,
243
+ isComposedPath: false,
240
244
  };
241
245
  if (typeof selector === "function") {
242
246
  /* 这是为没有selector的情况 */
243
- _callback_ = selector;
244
- _option_ = getOption(args, 3, _option_);
247
+ listenerCallBack = selector;
248
+ listenerOption = getOption(args, 3, listenerOption);
245
249
  }
246
250
  else {
247
251
  /* 这是存在selector的情况 */
248
- _option_ = getOption(args, 4, _option_);
252
+ listenerOption = getOption(args, 4, listenerOption);
249
253
  }
250
254
  /**
251
255
  * 如果是once,那么删除该监听和元素上的事件和监听
252
256
  */
253
257
  function checkOptionOnceToRemoveEventListener() {
254
- if (_option_.once) {
258
+ if (listenerOption.once) {
255
259
  DOMUtilsContext.off(element, eventType, selector, callback, option);
256
260
  }
257
261
  }
@@ -261,53 +265,60 @@ var DOMUtils = (function () {
261
265
  * @param event
262
266
  */
263
267
  function domUtilsEventCallBack(event) {
264
- let target = event.target;
268
+ let eventTarget = listenerOption.isComposedPath
269
+ ? event.composedPath()[0]
270
+ : event.target;
265
271
  if (selectorList.length) {
266
- /* 存在自定义子元素选择器 */
272
+ /* 存在子元素选择器 */
267
273
  let totalParent = DOMUtilsCommonUtils.isWin(elementItem)
268
274
  ? DOMUtilsContext.windowApi.document.documentElement
269
275
  : elementItem;
270
276
  for (let index = 0; index < selectorList.length; index++) {
271
277
  const selectorItem = selectorList[index];
272
- if (target.matches(selectorItem)) {
278
+ if (eventTarget.matches(selectorItem)) {
273
279
  /* 当前目标可以被selector所匹配到 */
274
- _callback_.call(target, event);
280
+ listenerCallBack.call(eventTarget, event);
275
281
  checkOptionOnceToRemoveEventListener();
276
282
  break;
277
283
  }
278
- else if (target.closest(selectorItem) &&
279
- totalParent.contains(target.closest(selectorItem))) {
284
+ else {
280
285
  /* 在上层与主元素之间寻找可以被selector所匹配到的 */
281
- let closestElement = target.closest(selectorItem);
282
- /* event的target值不能直接修改 */
283
- OriginPrototype.Object.defineProperty(event, "target", {
284
- get() {
285
- return closestElement;
286
- },
287
- });
288
- _callback_.call(closestElement, event);
289
- checkOptionOnceToRemoveEventListener();
290
- break;
286
+ let $closestMatches = eventTarget.closest(selectorItem);
287
+ if ($closestMatches && totalParent.contains($closestMatches)) {
288
+ /* eventtarget值不能直接修改 */
289
+ // 这里尝试使用defineProperty修改event的target值
290
+ try {
291
+ OriginPrototype.Object.defineProperty(event, "target", {
292
+ get() {
293
+ return $closestMatches;
294
+ },
295
+ });
296
+ }
297
+ catch (error) { }
298
+ listenerCallBack.call($closestMatches, event);
299
+ checkOptionOnceToRemoveEventListener();
300
+ break;
301
+ }
291
302
  }
292
303
  }
293
304
  }
294
305
  else {
295
- _callback_.call(elementItem, event);
306
+ listenerCallBack.call(elementItem, event);
296
307
  checkOptionOnceToRemoveEventListener();
297
308
  }
298
309
  }
299
310
  /* 遍历事件名设置元素事件 */
300
311
  eventTypeList.forEach((eventName) => {
301
- elementItem.addEventListener(eventName, domUtilsEventCallBack, _option_);
312
+ elementItem.addEventListener(eventName, domUtilsEventCallBack, listenerOption);
302
313
  /* 获取对象上的事件 */
303
314
  let elementEvents = elementItem[DOMUtilsData.SymbolEvents] || {};
304
315
  /* 初始化对象上的xx事件 */
305
316
  elementEvents[eventName] = elementEvents[eventName] || [];
306
317
  elementEvents[eventName].push({
307
318
  selector: selectorList,
308
- option: _option_,
319
+ option: listenerOption,
309
320
  callback: domUtilsEventCallBack,
310
- originCallBack: _callback_,
321
+ originCallBack: listenerCallBack,
311
322
  });
312
323
  /* 覆盖事件 */
313
324
  // @ts-ignore
@@ -323,12 +334,13 @@ var DOMUtils = (function () {
323
334
  * @param option
324
335
  */
325
336
  function getOption(args1, startIndex, option) {
326
- if (typeof args1[startIndex] === "boolean") {
327
- option.capture = args1[startIndex];
337
+ let currentParam = args1[startIndex];
338
+ if (typeof currentParam === "boolean") {
339
+ option.capture = currentParam;
328
340
  }
329
- else if (typeof args1[startIndex] === "object" &&
330
- "capture" in args1[startIndex]) {
331
- option.capture = args1[startIndex].capture;
341
+ else if (typeof currentParam === "object" &&
342
+ "capture" in currentParam) {
343
+ option.capture = currentParam.capture;
332
344
  }
333
345
  return option;
334
346
  }
@@ -366,20 +378,31 @@ var DOMUtils = (function () {
366
378
  /**
367
379
  * 事件的回调函数
368
380
  */
369
- let _callback_ = callback;
381
+ let listenerCallBack = callback;
370
382
  /**
371
383
  * 事件的配置
372
384
  */
373
- let _option_ = {
385
+ let listenerOption = {
374
386
  capture: false,
375
387
  };
376
388
  if (typeof selector === "function") {
377
389
  /* 这是为没有selector的情况 */
378
- _callback_ = selector;
379
- _option_ = getOption(args, 3, _option_);
390
+ listenerCallBack = selector;
391
+ listenerOption = getOption(args, 3, listenerOption);
380
392
  }
381
393
  else {
382
- _option_ = getOption(args, 4, _option_);
394
+ listenerOption = getOption(args, 4, listenerOption);
395
+ }
396
+ // 是否移除所有事件
397
+ let isRemoveAll = false;
398
+ if (args.length === 2) {
399
+ // 目标函数、事件名
400
+ isRemoveAll = true;
401
+ }
402
+ else if ((args.length === 3 && typeof args[2] === "string") ||
403
+ Array.isArray(args[2])) {
404
+ // 目标函数、事件名、子元素选择器
405
+ isRemoveAll = true;
383
406
  }
384
407
  elementList.forEach((elementItem) => {
385
408
  /* 获取对象上的事件 */
@@ -392,26 +415,25 @@ var DOMUtils = (function () {
392
415
  }
393
416
  for (let index = 0; index < handlers.length; index++) {
394
417
  let handler = handlers[index];
395
- let flag = false;
396
- if (!selectorList.length) {
397
- // selectorList是空的,默认移除
398
- flag = true;
418
+ let flag = true;
419
+ if (flag &&
420
+ listenerCallBack &&
421
+ handler.originCallBack !== listenerCallBack) {
422
+ // callback不同
423
+ flag = false;
399
424
  }
400
- else {
401
- if (Array.isArray(handler.selector) &&
402
- JSON.stringify(handler.selector) === JSON.stringify(selectorList)) {
403
- // 元素上的selectorList不为空且和传入的相同
404
- flag = true;
425
+ if (flag && selectorList.length && Array.isArray(handler.selector)) {
426
+ if (JSON.stringify(handler.selector) !== JSON.stringify(selectorList)) {
427
+ // 子元素选择器不同
428
+ flag = false;
405
429
  }
406
430
  }
407
- if (!_callback_ ||
408
- handler.callback === _callback_ ||
409
- handler.originCallBack === _callback_) {
410
- /* callback不为空,且callback相同 */
411
- flag = true;
431
+ if (flag && listenerOption.capture !== handler.option.capture) {
432
+ // 事件的配置项不同
433
+ flag = false;
412
434
  }
413
- if (flag) {
414
- elementItem.removeEventListener(eventName, handler.callback, _option_);
435
+ if (flag || isRemoveAll) {
436
+ elementItem.removeEventListener(eventName, handler.callback, handler.option);
415
437
  handlers.splice(index--, 1);
416
438
  }
417
439
  }
@@ -1013,7 +1035,7 @@ var DOMUtils = (function () {
1013
1035
  super(option);
1014
1036
  }
1015
1037
  /** 版本号 */
1016
- version = "2024.12.3";
1038
+ version = "2024.12.4";
1017
1039
  attr(element, attrName, attrValue) {
1018
1040
  let DOMUtilsContext = this;
1019
1041
  if (typeof element === "string") {