window.addEventListener 监听不存在的div

对于监听不存在的div，window.addEventListener无法直接监听该div的事件。因为window.addEventListener是用来监听window对象上的事件，而不存在的div无法被监听。如果你想要监听一个不存在的div的事件，可以使用MutationObserver来实现。MutationObserver是一个用来监听DOM变化的API，可以观察到DOM的添加、删除、属性变化等操作。你可以通过创建一个MutationObserver实例，然后将目标设置为你希望监听的div，通过指定不同的配置选项来监听＊＊＊```javascript
const targetDiv = document.getElementById('nonexistent-div');
const observer = new MutationObserver((mutationsList, observer) => {
// 处理DOM变化的回调函数
mutationsList.forEach((mutation) => {
console.log(mutation);
});
});

// 配置选项
const config = { attributes: true, childList: true, subtree: true };

// 监听DOM变化
observer.observe(targetDiv, config);

这样，当你的目标div被创建或者发生其他变化时，MutationObserver的回调函数将会被触发。

相关问题

window.addEventListener和div.addEventListener和document.addEventListener

window.addEventListener、div.addEventListener和document.addEventListener都是用于添加事件监听器的方法，它们之间有一些区别。

1. window.addEventListener：这个方法将事件监听器添加到整个浏览器窗口对象上。它可以用于捕获或冒泡阶段监听窗口对象上的各种事件，如点击、滚动、调整窗口大小等。

2. div.addEventListener：这个方法将事件监听器添加到指定的 `<div>` 元素上。它用于捕获或冒泡阶段监听该 `<div>` 元素上的各种事件，如点击、鼠标移动、键盘输入等。

3. document.addEventListener：这个方法将事件监听器添加到整个文档对象上。它可以用于捕获或冒泡阶段监听整个文档上的各种事件，如点击、滚动、键盘输入等。

它们的语法结构相似，都需要指定要监听的事件类型和事件处理函数。例如，以下是一个使用window.addEventListener来监听点击事件的示例：

window.addEventListener('click', function(event) {
  // 在这里处理点击事件
});

vue3+ts 怎么写window.addEventListener

在Vue3+TS中，可以使用`ref`来获取DOM元素，然后在`onMounted`生命周期函数中添加`window.addEventListener`事件监听器。具体步骤如下：
1. 在Vue组件中使用`ref`获取DOM元素，例如：

<template>
  <div ref="myDiv"></div>
</template>

<script lang="ts">
import { defineComponent, ref } from 'vue';

export default defineComponent({
  setup() {
    const myDiv = ref(null);
    // ...
  }
});
</script>

2. 在`onMounted`生命周期函数中添加`window.addEventListener`事件监听器，例如：

<script lang="ts">
import { defineComponent, ref, onMounted } from 'vue';

export default defineComponent({
  setup() {
    const myDiv = ref(null);

    onMounted(() => {
      window.addEventListener('resize', () => {
        // 更新操作
      });
    });

    // ...
  }
});
</script>

注意：在组件销毁时，需要使用`onUnmounted`生命周期函数移除事件监听器，以避免内存泄漏。