使用Jquery操作iframe中的元素

前几天，在原有功能上追加功能，jsp页面是已经存在了的，通过jquery获取元素总是获取不到，很奇怪，所以就仔细的看看了看jsp，原来那段代码是iframe里面的，虽然经常用jquery，但我一开始还真不知道iframe里面的东西，按照我们通常的方式取不到，所以查了下发现，jquery里面有个这个方法contents()。

下面直接贴下简单的代码示例：

<iframe src="/test/demo.htm" width="99%" height="300" id="frameTHY"></iframe>
<script>
window.onload = function() {
    $( "#frameTHY" ).contents().find( "a" ).css( "background-color", "red" );
};
</script>

另外这里说一下，iframe的src的地址必须是当前站点域名内的才能够被访问到，否在的话是访问不到的，比如下面这种情况。

<iframe src="www.baidu.com" width="99%" height="300" id="frameTHY"></iframe>
<script>
window.onload = function() {
    $( "#frameTHY" ).contents().find( "a" ).css( "background-color", "red" );
};
</script>

访问百度，因为跨域名，所以根本不可能得到任何内容。

还有一点需要注意，如果你要获取iframe中的元素，那么必须使用window.onload，必须是这个页面加载完后执行，一定不能是页面初始化，这一点切记，其实大家自己也可以分析…当前页面的初始化结束了，并不代表iframe页面的初始化也结束了》。。所以你要获取的元素可能还没有被初始化出来呢…自然也就得不到什么东西了….