在iframe src更改时触发自定义事件

是指在网页中使用iframe元素嵌入其他网页，并且当iframe的src属性发生变化时，通过自定义事件来触发相应的操作或逻辑。

具体实现方式如下：

首先，在父页面中创建一个iframe元素，并设置一个唯一的id属性，如下所示：

<iframe id="myFrame" src="initial.html"></iframe>

接下来，在父页面的JavaScript代码中，监听iframe的src属性变化，并触发自定义事件，如下所示：

var iframe = document.getElementById('myFrame');

// 监听iframe的src属性变化
Object.defineProperty(iframe, 'src', {
  set: function(newSrc) {
    // 设置新的src属性值
    iframe.setAttribute('src', newSrc);
    
    // 触发自定义事件
    var event = new CustomEvent('iframeSrcChanged', { detail: newSrc });
    window.dispatchEvent(event);
  }
});

然后，在父页面的其他地方，可以通过监听自定义事件来执行相应的操作，如下所示：

window.addEventListener('iframeSrcChanged', function(event) {
  var newSrc = event.detail;
  
  // 执行相应的操作
  console.log('iframe的src属性已更改为：' + newSrc);
});

通过以上步骤，当iframe的src属性发生变化时，会触发自定义事件，并可以在其他地方监听该事件并执行相应的操作。

应用场景：