zoukankan      html  css  js  c++  java
  • 【温故而知新-JQ的节点类型】

    来源:http://www.hi-docs.com/jquery/contents.html

    定义和用法

    查找匹配元素内部所有的子节点(包括文本节点)。如果元素是一个iframe,则查找文档内容

    语法
    contents()
    例子 1

    查找所有文本节点并加粗

    # HTML 代码:
    <p>Hello <a href="http://ejohn.org/">John</a>, how are you doing?</p>
    # jQuery 代码:
    $("p").contents().not("[nodeType=1]").wrap("<b/>");// 已失效
    // 请使用filter替代
    $("p").contents().filter(function(){ return this.nodeType != 1; }).wrap("<b/>");
    // nodeType 表示节点类型:1 元素节点,2 属性节点,3 文本节点
    结果:

    <p><b>Hello</b> <a href="http://ejohn.org/">John</a>, <b>how are you doing?</b></p>
    例子 2

    查找标签并替换其内容

    <html>
    <head>
    <script type='text/javascript' src='jquery.min.js?ver=3.4.2'></script>
    </head>
    <body><div id="t"><a>11</a><a>22</a><em>www.hi-docs.com</em></div>
    <script type="text/javascript">$('div').contents().filter('a').text('嗨豆壳');</script>
    </body>
    </html>
    结果:

    嗨豆壳嗨豆壳www.hi-docs.com
    获取iframe内容,注意:iframe内容必须是同域的

    <script src="http://ajax.useso.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
    <iframe src="error.html"></iframe>
    <button id="get_iframe">获取ifrmae内容</button>
    <script type="text/javascript">
    $('#get_iframe').click(function(){
    alert($('iframe').contents().text());
    })
    </script>

  • 相关阅读:
    MYSQL 优化(二),持续更新收藏
    一些linux命令 备份下
    lsyncd +xinetd+syncd 多服务器文件同步
    阿里slb+ecs+https
    微擎 从 php5 到php7 的各种填坑 持续更新
    lmap
    微擎的ifp ife ifpp
    工具索引 mark名字
    Funny Bug || Sky Hole
    mysql 查询小技巧
  • 原文地址:https://www.cnblogs.com/micro-chen/p/5430401.html
Copyright © 2011-2022 走看看