使用jQuery创建节点、将节点插入到指定的位置
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="jquery-1.11.1.js"></script>
<script type="text/javascript">
$(function (){
//1、创建节点
//2、插入节点,在该节点的子节点的最后面插入
$("<li id='shenzhen'>[shenzhen]</li>").appendTo($("#city"));
$("#city").append("<li id='shenzhen'>shenzhen</li>"); //插入结点:在该节点的子节点的最前面插入
$("<li id='math'>数学</li>").prependTo($("#major"));
$("#major").prepend("<li id='math'>[数学]</li>"); //把新创建的节点添加到指定节点之后
$("<li id='shenzhen'>shenzhen</li>").insertAfter($("#beijing"));
$("#beijing").after("<li id='shenzhen'>[shenzhen]</li>"); //把新创建的节点添加到指定节点之前
$("<li id='shenzhen'>shenzhen</li>").insertBefore($("#beijing"));
$("#beijing").before($("<li id='shenzhen'>[shenzhen]</li>")); });
</script>
</head>
<body>
<p>选择你所喜欢的城市?</p>
<ul id="city">
<li>哈尔滨</li>
<li id="beijing">北京</li>
<li>上海</li>
<li>广州</li>
</ul>
<p>选择你所喜欢的专业?</p>
<ul id="major">
<li>计算机</li>
<li>会计</li>
<li>管理学</li>
<li>印刷工程</li>
</ul>
</body>
</html>
使用jQuery创建节点、将节点插入到指定的位置的更多相关文章
- 如何通过JQuery将DIV的滚动条滚动到指定的位置
这里有一个方法可以将DIV的滚动条滚动到其子元素所在的位置,方便自动定位. var container = $('div'), inner = $('#inner'); container.scrol ...
- jQuery修炼心得-DOM节点的插入
1. 内部插入append()与appendTo() append:这个操作与对指定的元素执行原生的appendChild方法,将它们添加到文档中的情况类似. appendTo:实际上,使用这个方法是 ...
- jacascript DOM节点——元素节点、属性节点、文本节点
前言:这是笔者学习之后自己的理解与整理.如果有错误或者疑问的地方,请大家指正,我会持续更新! DOM节点的三个种类:元素节点.文本节点.属性节点: 元素节点 元素节点就是 HTML 标签元素,元素节点 ...
- js进阶 11-9/10/11 jquery创建和插入节点
js进阶 11-9/10/11 jquery创建和插入节点 一.总结 一句话总结: 1.jquery插入节点8个方法? 内部之前,内部之后,之前,之后:各两个 append()和appendTo() ...
- jQuery中的查找节点、创建节点、插入节点、删除节点、替换节点、复制节点操作方法
jQuery操作节点我们可以分六点来讲,查找节点.创建节点.插入节点.删除节点.替换节点.复制节点. 一.查找节点 text() - 设置或返回所选元素的文本内容 ,html() - 设置或返回所 ...
- jQuery创建节点
注:摘自<锋利的jQuery(第二版)> 创建元素节点 例如要创建两个<li>元素节点,并且要把它们作为<ul>元素节点的子节点添加到DOM节点树上.完成这个任务需 ...
- 手写面试编程题- 数组去重 深拷贝 获取文本节点 设置奇数偶数背景色 JS中检测变量为string类型的方法 第6题闭包 将两个数组合并为一个数组 怎样添加、移除、移动、复制、创建和查找节点? 继承 对一个数组实现随机排序 让元素水平 垂直居中的三种方式 通过jQuery的extend方法实现深拷贝
第1题==>实现数组去重 通过 new Set(数组名) // var arr = [12, 12, 3, 4, 5, 4, 5, 6, 6]; // var newarr1 = new Set ...
- JavaScript&&jQuery创建新节点和操作属性对比
JavaScript创建新节点和操作属性 通过JavaScript原生接口创建节点,在处理上是非常复杂与繁琐的. <!DOCTYPE html> <html lang="e ...
- 通过jquery创建节点以及节点属性处理
<!DOCTYPE html><html> <head> <meta http-equiv="Content-type" conte ...
随机推荐
- 关于Unity的组件和作用
一.Transform组件 整个场景由节点树组成. 节点+Transform组件,每个Transform有自己的孩子Transform,由Transform组成Transform树,而每个Transf ...
- 第二百六十一节,Tornado框架模板引擎本质
Tornado框架模板引擎本质 只需要了解一下即可 本篇就来详细的剖析模板处理的整个过程. 上图是返回给用户一个html文件的整个流程,较之前的Demo多了绿色流线的步骤,其实就是把[self.wri ...
- Hadoop是原Yahoo的Doug Cutting根据Google发布的学术论文研究而来
Hadoop是原Yahoo的Doug Cutting根据Google发布的学术论文研究而来.Doug Cutting给这个Project起了个名字,就叫Hadoop. Doug Cutting在Clo ...
- 浅谈Spring(一)
Spring 框架是一个分层架构,由 7 个定义良好的模块组成.Spring 模块构建在核心容器之上,核心容器定义了创建.配置和管理 bean 的方式. watermark/2/text/aHR0cD ...
- VC++中CEdit控件实现回车换行
1.通过回车Enter换行: 这里要有两个设置 <1>.将控件的属性设置为Mutilines->true; <2>.将控件的另一个属性设置为Want return-> ...
- C++ 访问控制 public, protected, private, 友元
1. 变量属性与继承之间的关系 #include <iostream> using namespace std; class A { public: int x; protected: i ...
- UE4中VR模式下窗口单目双目的问题
如果要是单目的话使用HMD MIRROR MODE 3或者4
- tableview直接滚动至最后一行
类似聊天界面,tableview应该直接显示在最后一行,并且不应该有滚动的出现. 在网上查了很久,直接滚动至最后一行很容易实现,有两种方法比较好. 1. 调用scrollToRowAtIndexPat ...
- AsyncTask--远程图片获取与本地缓存
对于客户端——服务器端应用,从远程获取图片算是经常要用的一个功能,而图片资源往往会消耗比较大的流量,对应用来说,如果处理不好这个问题,那会让用户很崩溃,不知不觉手机流量就用完了,等用户发现是你的应用消 ...
- 基于 Golang 的 xls 读取类库:xls
Golang 编写的 xls 读取类库,能够实现 xls 表格的读取功能 func (w *WorkBook) ReadAllCells() (res [][]string) { for _, she ...