jQuery简单创建节点的方法


Posted in Javascript onSeptember 09, 2016

本文实例讲述了jQuery简单创建节点的方法。分享给大家供大家参考,具体如下:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script type="text/javascript" src="js/jquery-1.10.1.min.js"></script>
<script type="text/javascript">
//<![CDATA[
$(function(){
  var $li_1 = $("<li title='香蕉'>香蕉</li>"); //创建一个<li>元素
  //包括元素节点,文本节点和属性节点
  //其中title='香蕉' 就是创建的属性节点
  var $li_2 = $("<li title='雪梨'>雪梨</li>"); //创建一个<li>元素
  //包括元素节点,文本节点和属性节点
  //其中title='雪梨' 就是创建的属性节点
  var $parent = $("ul"); // 获取<ul>节点。<li>的父节点
  $parent.append($li_1); // 添加到<ul>节点中,使之能在网页中显示
  $parent.append($li_2); // 等价于:$parent.append($li_1).append($li_2);
});
//]]>
</script>
</head>
<body>
<p title="选择你最喜欢的水果." >你最喜欢的水果是?</p>
<ul>
  <li title='苹果'>苹果</li>
  <li title='橘子'>橘子</li>
  <li title='菠萝'>菠萝</li>
</ul>
</body>
</html>

效果图如下:

jQuery简单创建节点的方法

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
超酷的网页音乐播放器DewPlayer使用方法
Dec 18 Javascript
javascript实现图片切换的幻灯片效果源代码
Dec 12 Javascript
JavaScript避免内存泄露及内存管理技巧
Sep 05 Javascript
javascript实现点击单选按钮链接转向对应网址的方法
Aug 12 Javascript
jquery+CSS实现的多级竖向展开树形TRee菜单效果
Aug 24 Javascript
javascript下拉列表菜单的实现方法
Nov 18 Javascript
javascript中数组和字符串的方法对比
Jul 20 Javascript
react-native-tab-navigator组件的基本使用示例代码
Sep 07 Javascript
react 兄弟组件如何调用对方的方法示例
Oct 23 Javascript
使用flow来规范javascript的变量类型
Sep 12 Javascript
Js逆向实现滑动验证码图片还原的示例代码
Mar 10 Javascript
javascript中Set、Map、WeakSet、WeakMap区别
Dec 24 Javascript
javascript 四十条常用技巧大全
Sep 09 #Javascript
前端弹出对话框 js实现ajax交互
Sep 09 #Javascript
Boostrap基础教程之JavaScript插件篇
Sep 08 #Javascript
jQuery实现邮箱下拉列表自动补全功能
Sep 08 #Javascript
JS图片放大效果简单实现代码
Sep 08 #Javascript
Angularjs 实现一个幻灯片示例代码
Sep 08 #Javascript
利用Vue.js指令实现全选功能
Sep 08 #Javascript
You might like
AMFPHP php远程调用(RPC, Remote Procedure Call)工具 快速入门教程
2010/05/10 PHP
PHP中的strtr函数使用介绍(str_replace)
2011/10/20 PHP
一个简单的网页密码登陆php代码
2012/07/17 PHP
php的$_FILES的临时储存文件与回收机制实测过程
2013/07/12 PHP
PHP中error_reporting函数用法详细介绍
2017/06/11 PHP
通过jQuery源码学习javascript(三)
2012/12/27 Javascript
Jquery绑定事件(bind和live的区别介绍)
2013/08/23 Javascript
JavaScript数组随机排列实现随机洗牌功能
2015/03/19 Javascript
Bootstrap图片轮播组件使用实例解析
2016/06/30 Javascript
vue 插值 v-once,v-text, v-html详解
2018/01/19 Javascript
JS实现的获取银行卡号归属地及银行卡类型操作示例
2019/01/08 Javascript
MockJs结合json-server模拟后台数据
2020/08/26 Javascript
js实现百度登录窗口拖拽效果
2020/03/19 Javascript
原生JS生成指定位数的验证码
2020/10/28 Javascript
[01:13]这,就是刀塔
2014/07/16 DOTA
[54:10]完美世界DOTA2联赛PWL S2 Magma vs FTD 第二场 11.29
2020/12/03 DOTA
Python使用Mechanize模块编写爬虫的要点解析
2016/03/31 Python
python中判断文件编码的chardet(实例讲解)
2017/12/21 Python
对python中矩阵相加函数sum()的使用详解
2019/01/28 Python
PyQt5笔记之弹出窗口大全
2019/06/20 Python
Django Rest framework认证组件详细用法
2019/07/25 Python
Django项目主urls导入应用中views的红线问题解决
2019/08/10 Python
Python求解排列中的逆序数个数实例
2020/05/03 Python
HTML5轻松实现全屏视频背景的示例
2018/04/23 HTML / CSS
最耐用行李箱,一箱永流传:Briggs & Riley(全球终身保修)
2017/12/07 全球购物
请写出 BOOL flag 与"零值"比较的 if 语句
2016/02/29 面试题
班级入场式解说词
2014/02/01 职场文书
机关会计岗位职责
2014/04/08 职场文书
乒乓球兴趣小组活动总结
2014/07/08 职场文书
考试作弊被抓检讨书
2014/10/02 职场文书
防灾减灾宣传标语
2014/10/07 职场文书
党的群众路线教育实践活动批评与自我批评发言稿
2014/10/16 职场文书
感谢信模板大全
2015/01/23 职场文书
单位推荐信范文
2015/03/27 职场文书
妈妈再爱我一次观后感
2015/06/08 职场文书
2019年聘任书的写作格式及范文!
2019/07/03 职场文书