1.介绍

　　

2.程序

 <!DOCTYPE html>

 <html>

 <head>

 <meta charset="UTF-8">

 <title>Insert title here</title>

 <script type="text/javascript" src="jquery-3.2.1.min.js"></script>

 <script type="text/javascript">

     $(function(){

         //包装 li 本身

         $("#game li").wrap("<font color='red'></font>");

         //包装所有的 li

         $("#city li").wrapAll("<font color='red'></font>");

         //包装 li 里边的文字.

         $("#language li").wrapInner("<font color='red'></font>");

     })

 </script>

 </head>

 <body>

     <p>你喜欢哪个城市?</p>

     <ul id="city">

         <li id="bj" name="BeiJing">北京</li>

         <li>上海</li>

         <li id="dj">东京</li>

         <li id="se">首尔</li>

     </ul>

     <br>

     <br>

     <p>你喜欢哪款单机游戏?</p>

     <ul id="game">

         <li id="rl">红警</li>

         <li>实况</li>

         <li>极品飞车</li>

         <li>魔兽</li>

     </ul>

     <br>

     <br>

     <p>你喜欢哪种开发语言?</p>

     <ul id="language">

         <li>C</li>

         <li>Java</li>

         <li>.NET</li>

         <li>PHP</li>

     </ul>

 </body>

 </html>

015 jquery中包裹节点的更多相关文章

  1. jquery中的节点的操作

    节点的操作 Dom 文档对象 模型 解决 一．插入节点 Append() 在每个匹配的元素中追加内容 Var  $li_1= “<li></li>”; Var  $li_2 = ...

  2. jQuery中删除节点方法remove()、detach()、empty()分析

    jQuery中提供了三种删除节点的方法:remove().detach().empty(),本文详细分析这三种方法. 最容易区分的是empty(),该方法严格上属于“清空节点”,即删除其子节点,自身并 ...

  3. jQuery中的节点操作(一)

    html代码如下 <p>Dom操作练习</p> jQuery插入节点 $("p").append("武汉php"); //向每个匹配的元 ...

  4. jQuery中的节点操作(二)

    html代码如下 <p title="武汉长乐教育PHP系列教程" name="hello" class="blue"> < ...

  5. js jquery中 的数据类型

    任何一门语言, buguan 是动态的, 还是像C语言的, 都有严格的 类型 "概念的", 这个是由于 编译器和解释器要求的, 需要的. 所以在是使用像 js, jquey ,ph ...

  6. jQuery 获取DOM节点的两种方式

    jQuery中包裹后的DOM对象实际上是一个数组,要获得纯粹的DOM对象可以有两种方式: 1.使用数组索引方式访问,例如: var dom = $(dom)[0]; 如: $("#id&qu ...

  7. jQuery中的DOM操作------复制及包裹节点

    1.复制节点: 如果单击<li>元素后需要再复制一个<li>元素,可以用clone()方法来完成: $(this).clone().appendTo("ul" ...

  8. es6 Object.assign ECMAScript 6 笔记（六） ECMAScript 6 笔记（一） react入门——慕课网笔记 jquery中动态新增的元素节点无法触发事件解决办法 响应式图像 弹窗细节 微信浏览器——返回操作 Float 的那些事 Flex布局 HTML5 data-* 自定义属性 参数传递的四种形式

    es6 Object.assign   目录 一.基本用法 二.用途 1. 为对象添加属性 2. 为对象添加方法 3. 克隆对象 4. 合并多个对象 5. 为属性指定默认值 三.浏览器支持 ES6 O ...

  9. jquery中关于append()的用法笔记---append()节点移动与复制之说

    jquery中关于append()的用法笔记---append()节点移动与复制之说 今天看一本关于jquery的基础教程,看到其中一段代码关于append()的一行,总是百思不得其解.于是查了查官方 ...

随机推荐

  1. jenkins构建docker镜像上传到harbor并发布到kubernetes

    很早之前写过一篇jenkins集成docker的文章,使用的是CloudBees Docker Build and Publish plugin插件.这篇文章是直接使用shell脚本做的,主要是这次有 ...

  2. 获取C++类成员虚函数地址

    1.GCC平台 GCC平台获取C++成员虚函数地址可使用如下方法[1]: class Base{ int i; public: virtual void f1(){ cout<<" ...

  3. php编程——验证码的实现（session方法）

    index.PHP(实现输入验证码页面)代码如下: <html><head><title>check code</title></head> ...

  4. Qt ------ WAV 音频文件播放

    1.用 QFile 打开 WAV 文件,读出文件头信息,看看是否符合音频播放设备的要求 QAudioDeviceInfo m_audioOutputDevice;//可以获取音频输出设备的信息,比如哪 ...

  5. ubuntu 下 python模块 mysql-python安装(转)

    原文:http://www.cnblogs.com/51kata/p/5406468.html 直接运行如下命令 sudo pip install MySQL-python 报如下错误 xxx@ubu ...

  6. Codeforces Round #481 (Div. 3) D. Almost Arithmetic Progression

    http://codeforces.com/contest/978/problem/D 题目大意: 给你一个长度为n的b(i)数组,你有如下操作: 对数组中的某个元素+1,+0,-1.并且这个元素只能 ...

  7. Java技术体系总结

    PC前端:Javascript.JQuery.Angularjs.Reactjs.TypeScript 移动前端:Vue.js.Zepto WebJars spring:spring mvc.spri ...

  8. 本日吐槽！“人傻钱多”的P2P公司是否是程序员的合适选择（群聊天记录的娱乐）

    这个题目“P2P的职位是否是程序员的合适选择”这个问题本身是没啥可以吐槽的 但是每当我们讨论那种类型的公司工资愿意给前端工程师开的最高的时候,P2P这个行业被第一个提出了 目前我收到过面试的企业类型千 ...

  9. JavaScript继承详解（三）

    在第一章中,我们使用构造函数和原型的方式在JavaScript的世界中实现了类和继承, 但是存在很多问题.这一章我们将会逐一分析这些问题,并给出解决方案. 注:本章中的jClass的实现参考了Simp ...

  10. bug处理

    当提示405 method not allowed 时候,路由可能有问题,看看路由是get/post 是否合格