在父页面获取子页面元素值的方法

lhy_luan

于 2015-11-27 17:03:08 发布

阅读量6.2k

点赞数

文章标签： html

本文链接：https://blog.youkuaiyun.com/luanhaiyang/article/details/50072577

版权

当在一个html父页面中嵌入html子页时，当点击父页面的元素需要读取或者操作子页面元素时，以下方法十分有效。

<!-- fu.html -->
<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="UTF-8">
</head>
<body>
    <div>
        <iframe src="./zi.html"></iframe>
        <button class="yes">确定</button>
    </div>
    <script type="text/javascript">
        $(document).on('click','.yes',function(){
            var text = $('div iframe').contents().find('.tt tr td.one').text();
            alert('输出结果：'+ text);
        });
    </script>
    <script type="text/javascript" src="./jquery-1.10.2.min.js"></script>
</body>
</html>


<!-- zi.html -->
<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    <table class="tt">
        <tr>
            <td class="one">1</td>
            <td>2</td>
            <td>3</td>
        </tr>
    </table>
</body>
</html>