平时很少接触到 iframe,所以对相关的知识也挺匮乏的。刚好昨天接触到,也了解了一些知识。先占个坑,整理一下今天所得的知识,日后再慢慢补充相关的知识。
获取 iframe 元素
关于获取 iframe 子页面的元素,在网上查找了许久,发现大多是一样的,而且不知道为什么,并不是正确的。最后终于找到了一个真正正确的答案。
$(iframeID).contents().find(‘sth’);
判断 iframe 是否加载完成
要获取 iframe 里的元素,在上面的描述中,已经得到解答。但是也出现了一个问题:直接用遍历方法的话会在页面生成之前就执行,此时 iframe 可能还没有加载完成。
那么问题来了,怎么解决这个情况呢?
一开始,我是琢磨着使用定时器,设定一定时间后再执行查找元素的操作。乍一看好像达到了效果。但是,个人觉得,这样还是不妥。因为 iframe 加载完成所需的时间和网络情况等有关,而设置的时间过短,加载所需时间可能会超过自己定好的时间。如果过长,则会导致下来的操作延时,影响交互,使用体验大打折扣。
于是,就有了另一个方案。就是 iframe 具有的 onload 事件。利用这个,可以在 iframe 加载完成时触发。
另外,知道 iframe 加载完成的事件,除了解决上述问题,还可以通过在触发事件之前,以一个“Loading”的动画提示,以达到一个较好的用户体验。