javascript - jquery 检测显示或可见性的变化

Question

有没有办法让我检测类的样式属性是否发生变化，例如显示或可见性的变化？

我的情况是，我通过 iframe 在我的网站上嵌入了 Podio 网络表单。 .webforms__success-message > p 中有一条隐藏的感谢信息我想在成功消息出现在页面上时滚动到它。

Answer 1

我会推荐 VueJS 而不是 jQuery。它速度更快，因为它使用虚拟 dom，并且不必遍历 dom 来检测更改。您只需创建一个操作，然后将该操作作为事件发出即可。然后您可以调用您想要的任何 jQuery 函数。

<div id="app">
   <iframe v-show="isShowing" src="http://www.weather.gov/" 
        frameborder="0"
        ></iframe>
  <button @click="isShowing ^= true">Click Me</button>
</div>

CSS

iframe {
  display:block;
  margin-top: 20px;
  margin-left: 200px;
  width:850px;
  height:300px;
}

JS

var vue = new Vue({
  el:"#app",
  data: {
    isShowing:false,
  }
})

看看这个Codepen