<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
<meta charset="utf-8" />
    <script src="jquery-3.3.1.js"></script>
    <script>
        $(function () {
            $('#btn').click(function () {
                //每对p标签都会用font标签包裹
                //$('div p').wrap('<font color="blue" size="7" face="全新硬笔行书简"></font>');

                //所有的p标签都被一对font标签包裹
                //$('div p').wrapAll('<font color="blue" size="7" face="全新硬笔行书简"></font>');

                //把p标签的文字内容用font包裹起来，但是p标签在外面
                $('div p').wrapInner('<font color="blue" size="7" face="全新硬笔行书简"></font>');
            })
        })
    </script>
</head>
<body>
    <input type="button" name="name" value="btn" id="btn"/>
    <div>
        <p>这是p</p>
        <p>这也是p</p>
    </div>
</body>
</html>

jquery 包裹标签的更多相关文章

  1. jQuery 浮动标签插件，帮助你提升表单用户体验

    浮动标签模式(Float Label Pattern)是最新流行的一种表单输入域的内容提示方式,当用户在输入框输入内容的时候,原先占位符的内容向上移动,显示在输入的内容的上面.这里推荐的这款 jQue ...

  2. jQuery包裹节点用法完整示例

    本文实例讲述了jQuery包裹节点用法.分享给大家供大家参考,具体如下: <html> <head> <meta http-equiv="Content-Typ ...

  3. jquery实战---标签页效果

    在前面的博客中,小编主要简单的介绍了jquery的一些基本知识,今天这篇博文,小编继续来学习jquery的相关知识,今天我们来学习一个标签页的小例子,相关源码小编已经上传,有需要的小伙伴可以自己去下载 ...

  4. jQuery对标签、类样式、值、文档、DOM对象的操作

    jquery的标签属性操作 使用attr()方法对html标签属性进行操作,attr如果参数是一个参数,表示获取html标签的属性值,如果是两个参数则是设置标签属性名以及对象的属性值 .prop()适 ...

  5. jQuery操作标签

    jQuery操作标签 样式操作: 对标签的样式进行修改,那么操作样式的方法是什么? 样式类: addClass();// 添加指定的CSS类名. removeClass();// 移除指定的CSS类名 ...

  6. jquery教程-Jquery 获取标签个数 size()函数用法

    jquery教程-Jquery 获取标签个数 size()函数用法,size() 方法返回被 jQuery 选择器匹配的元素的数量. 语法 $(selector).size()     jQuery ...

  7. JavaScript和jQuery改变标签内容

    HTML: <div id="mazey">content</div> JavaScript: var mazey=document.getElementB ...

  8. jquery遍历标签中自定义的属性方法

    在开发中我们有时会对html标签添加属性,如何遍历处理 <ul> <li name="li1" sortid="nav_1">aaaaa ...

  9. JQuery查找标签

    JQuery查找标签 一.基本标签 1 id选择器: $("#id(名称)") $("#cent") 2 标签选择器: $("tabName(便签名称 ...

随机推荐

  1. 使用Fernflower 比较准确的反编译整个java项目

    以前一直使用jd-gui.exe  ,都说是最好用的,但是编译总是有问题,还得修改,使用idea 后,感觉反编译的相当好,看注释是 Fernflower,然后参考 http://the.bytecod ...

  2. Color the ball（杭电1556）

    Color the ball Time Limit : 9000/3000ms (Java/Other)   Memory Limit : 32768/32768K (Java/Other) Tota ...

  3. ios9 xcode7以后编译需要进行的几项设置

    http://blog.csdn.net/hero82748274/article/details/48629461 1.库后缀变了:.dylib->tbd libsqlite3.0.dylib ...

  4. Android View框架的measure机制

    概述 Android中View框架的工作机制中,主要有三个过程: 1.View树的測量(measure)Android View框架的measure机制 2.View树的布局(layout) Andr ...

  5. WPF应用最小化至系统托盘运行

    原文:WPF应用最小化至系统托盘运行 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/lordwish/article/details/5178889 ...

  6. （翻译）2016美国数学建模MCM E题(环境)翻译:我们朝向一个干旱的星球？

    PROBLEM E: Are we heading towards a thirsty planet? Will the world run out of clean water? According ...

  7. BZOJ 1864 三色二叉树 - 树型dp

    传送门 题目大意: 给一颗二叉树染色红绿蓝,父亲和儿子颜色必须不同,两个儿子颜色必须不同,问最多和最少能染多少个绿色的. 题目分析: 裸的树型dp:\(dp[u][col][type]\)表示u节点染 ...

  8. 前端css实现最基本的时间轴

    原型: 图片.png 代码: <!DOCTYPE html > <html> <head> <link rel="stylesheet" ...

  9. 【b604】2K进制数

    Time Limit: 1 second Memory Limit: 50 MB [问题描述] 设r是个2K进制数,并满足以下条件: (1)r至少是个2位的2K进制数. (2)作为2K进制数,除最后一 ...

  10. CentOS7查看开放端口命令

    CentOS7查看开放端口命令   CentOS7的开放关闭查看端口都是用防火墙来控制的,具体命令如下: 查看已经开放的端口: /tcp --permanent 命令含义: –zone #作用域 –a ...