<!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创建节点、将节点插入到指定的位置的更多相关文章

  1. 如何通过JQuery将DIV的滚动条滚动到指定的位置

    这里有一个方法可以将DIV的滚动条滚动到其子元素所在的位置,方便自动定位. var container = $('div'), inner = $('#inner'); container.scrol ...

  2. jQuery修炼心得-DOM节点的插入

    1. 内部插入append()与appendTo() append:这个操作与对指定的元素执行原生的appendChild方法,将它们添加到文档中的情况类似. appendTo:实际上,使用这个方法是 ...

  3. jacascript DOM节点——元素节点、属性节点、文本节点

    前言:这是笔者学习之后自己的理解与整理.如果有错误或者疑问的地方,请大家指正,我会持续更新! DOM节点的三个种类:元素节点.文本节点.属性节点: 元素节点 元素节点就是 HTML 标签元素,元素节点 ...

  4. js进阶 11-9/10/11 jquery创建和插入节点

    js进阶 11-9/10/11 jquery创建和插入节点 一.总结 一句话总结: 1.jquery插入节点8个方法? 内部之前,内部之后,之前,之后:各两个 append()和appendTo() ...

  5. jQuery中的查找节点、创建节点、插入节点、删除节点、替换节点、复制节点操作方法

    jQuery操作节点我们可以分六点来讲,查找节点.创建节点.插入节点.删除节点.替换节点.复制节点. 一.查找节点 text() - 设置或返回所选元素的文本内容   ,html() - 设置或返回所 ...

  6. jQuery创建节点

    注:摘自<锋利的jQuery(第二版)> 创建元素节点 例如要创建两个<li>元素节点,并且要把它们作为<ul>元素节点的子节点添加到DOM节点树上.完成这个任务需 ...

  7. 手写面试编程题- 数组去重 深拷贝 获取文本节点 设置奇数偶数背景色 JS中检测变量为string类型的方法 第6题闭包 将两个数组合并为一个数组 怎样添加、移除、移动、复制、创建和查找节点？ 继承 对一个数组实现随机排序 让元素水平 垂直居中的三种方式 通过jQuery的extend方法实现深拷贝

    第1题==>实现数组去重 通过 new Set(数组名) // var arr = [12, 12, 3, 4, 5, 4, 5, 6, 6]; // var newarr1 = new Set ...

  8. JavaScript&&jQuery创建新节点和操作属性对比

    JavaScript创建新节点和操作属性 通过JavaScript原生接口创建节点,在处理上是非常复杂与繁琐的. <!DOCTYPE html> <html lang="e ...

  9. 通过jquery创建节点以及节点属性处理

    <!DOCTYPE html><html> <head>    <meta http-equiv="Content-type" conte ...

随机推荐

  1. malloc 返回值的类型是 void *

    malloc 返回值的类型是 void *,所以在调用 malloc 时要显式地进行类型转换,将 void * 转换成所需要的指针类型. #include <iostream> using ...

  2. 【BZOJ】1028: [JSOI2007]麻将（贪心+暴力）

    http://www.lydsy.com/JudgeOnline/problem.php?id=1028 表示不会贪心QAQ 按顺序枚举,如果能形成刻子那么就形成刻子,否则形成顺子.orz 证明?:因 ...

  3. 【mysql】一次有意思的数据库查询分析。

    本文是在做一家汽车配件的电商网站时,大体情景是一个List.php页面,该页面分页列出部分配件并统计总数量用于分页. 当然该页面中也可以指定一下查询条件,如适配的车辆品牌.车系.排量.年份等,一件商品 ...

  4. odoo 在原有工作流中添加审批流

    odoo 在原有工作流中添加审批流 步骤: 1.加入所需的工作流节点以及相连的线(即所添加的审批流),代码如下: <?xml version="1.0" encoding=& ...

  5. Apache版Phoenix的安装（图文详解）

    不多说,直接上干货! 写在前面的话 我这里,三个节点的bigdata集群.分别为master.slave1和slave2. 1.Phoenix的下载 我的HBase版本是hbase-0.98.19. ...

  6. iOS开发之--搭建本地的SVN服务器

    近期入职的新公司,后台没有分配svn账号,需要在本地搭建一个服务器,方便和代码,看了看网上的教程,一直有这样那样的问题, 其中最主要的问题还是路径拼接的问题,最后终于解决了,特在此分享下,如果大家有更 ...

  7. 第十三篇：K-Means 聚类算法原理分析与代码实现

    前言 在前面的文章中,涉及到的机器学习算法均为监督学习算法. 所谓监督学习,就是有训练过程的学习.再确切点,就是有 "分类标签集" 的学习. 现在开始,将进入到非监督学习领域.从经 ...

  8. JSP内置对象——response

    response对象response对象包含了响应客户端的有关信息,但在JSP中很少使用它.它是HttpServletResponse类的实例.response对象具有页面作用域,即访问一个页面时,该 ...

  9. Maven创建一个Web项目

    我们可以通过命令行或者直接使用Eclipse创建一个maven webapp项目:通过命令行创建在命令行中输入如下格式的命令将会创建一个新的maven webapp项目:mvn archetype:g ...

  10. Android测试：从零开始3—— Instrumented单元测试1

    Instrumented单元测试是指运行在物理机器或者模拟机上的测试,这样可以使用Android framework 的API和supporting API.这会在你需要使用设备信息,如app的Con ...