-->

  • aaa
  • bbb
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<%

 String path = request.getContextPath();

 String basePath = request.getScheme() + "://"

   + request.getServerName() + ":" + request.getServerPort()

   + path + "/";

%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

 <head>

  <base href="<%=basePath%>">

  <title>My JSP 'index.jsp' starting page</title>

  <meta http-equiv="pragma" content="no-cache">

  <meta http-equiv="cache-control" content="no-cache">

  <meta http-equiv="expires" content="0">

  <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

  <meta http-equiv="description" content="This is my page">

  <!--

 <link rel="stylesheet" type="text/css" href="styles.css">

 -->

  <script type="text/javascript"

   src="<%=request.getContextPath()%>/js/jquery-1.2.6.js"></script>

  <script type="text/javascript">

 function add()

 {

 //获取页面所有的ul

 var culs=document.getElementById("uls");

 //获取上一个ul的最后一个li控件

     //定义控件数组

  var childArray=[];

        //alert(culs.innerHTML);

        //判断是不是循环到最后一个li 如果li的总数刚好等于列数 就要将最后一行

        //的最后一个li设置到lastnext控制上 循环完成之后 div里添加一个ul 

   //新增一个li 放到数组中 是第一个位置

   var newli=document.createElement("li");

   //设置li的内部文本时文本框的值

   newli.innerHTML=document.getElementById("text").value;

   //新增的li放在第一个位置

   //去除所有的元素放入数组中 因为上一个控件的最后一个放在了第一位

      for(var j=0;j<culs.childNodes.length ;j++)

      {

		    if(culs.childNodes[0].nodeType != 3 )

	 { alert(culs.childNodes[0].innerHTML);

         //因为添加一个删除一个 最新的一个 用于是第一个位置

      childArray[childArray.length]=culs.childNodes[0];

      //删除添加的那个

      culs.removeChild(culs.childNodes[0]);

	 }

      }

	  childArray[childArray.length]=newli;

     //再将排好序的数组控件添加的当前的ul上

      for(var j=0;j<childArray.length;j++)

      {

      var ctx=childArray[j];

      //添加子元素

      culs.appendChild(ctx)

      }

 }

 //lastnext用于控制最后一行是否刚好等于列数 如果是 新添加一个ul

 </script>

 </head>

 <body>

  <div id="total">

   <ul id="uls">

    <li>

     aaa

    </li>

    <li>

     bbb

    </li>

   </ul>

  </div>

  <input id="text">

  <input type="button" value="add" onclick="add()" />

 </body>

</html>

　　

ul动态增加li的更多相关文章

  1. 解决jquery动态增加元素后children值没有变的问题

    html代码如下: <ul id="attr_input_panel"> <li> <div class="attr_input_item& ...

  2. JS动态增加删除UL节点LI

    JS如何动态增加删除UL节点LI及相关内容. <ul id="ul"> <li id=1>11111111111111111<a href=" ...

  3. JS动态增加删除UL节点LI及相关内容示例

    <ul id="ul"> <li id=1>11111111111111111<a href="javascript:del(1);&quo ...

  4. ul点击li,增加样式

    用户首次绑定后,需要选择一款头像 <!--imgList头像列表--><el-row class="regModel1"> <el-col :span ...

  5. ligerui_ligerTree_005_动态增加“树”节点

    动态添加ligerTree节点:效果图: 源码地址:http://download.csdn.net/detail/poiuy1991719/8571255 <%@ page language= ...

  6. 【轮子狂魔】手把手教你用JS给博客动态增加目录 - 超级懒人版

    动态显示目录的作用 不用每次写博客的时候繁琐的人工整理目录,又可以动态浮动在右下角,方便快速跳到感兴趣的位置同时也可以快速的对文章内容有一个大概的了解. 实现原理 首先根据个人喜好,我习惯了用 h1 ...

  7. jquery中为动态增加的元素添加事件

    // html代码 <ul id="main"> </ul> // js代码 $(function(){ // 动态添加html代码 $("#ma ...

  8. 给ul中的li添加事件的多种方法

    给ul中的li添加事件的多种方法 这是一个常见,而且典型的前端面试题 <ul> <li>11111</li> <li>22222</li> ...

  9. 对Ul下的li标签执行点击事件——如何获取你所点击的标签

    问题所来:做项目时,一般的数据都是用循环动态加载出来的,结构都是一样的,只是绑定的值不同,如何对相同的标签做处理的问题就来了. 例如:点谁就显示谁的数值 <ul > <li id=& ...

随机推荐

  1. Test-NetConnection

    有了PowerShell 4.0,排除网络故障的日子就会轻松很多.Test-NetConnection cmdlet将多个测试整合到了一个简单的有几个参数的命令当中.例如,命令Test-NetConn ...

  2. List 排序

    1:sort 这种实现是用朗姆达表达式实现.Comparison<T> 委托详见 http://msdn.microsoft.com/zh-cn/library/tfakywbh.aspx ...

  3. careercup-递归和动态规划 9.10

    9.10 给你一堆n个箱子,箱子宽w,高h,深d.箱子不能翻转,将箱子堆起来时,下面箱子的宽度.高度和深度必须大于上面的箱子.实现一个方法,搭出最高的一堆箱子,箱堆的高度为每个箱子高度的总和. 解法: ...

  4. linux的nohup disown setsid screen

    ```nohup 可以将进程挂起 帐号退出时不受影响 nohup cp -r a b/ [>/~/cp.log] & setsid 作用类似于nohup swtsid cp -r a b ...

  5. Linux common resources

    Useful Linux Web reources list Linux die manual Linux Man Pages Archive Linux RPM find Linux RPM Sea ...

  6. commons-io源码阅读心得

    FileCleanTracker: 开启一个守护线程在后台默默的删除文件. /* * Licensed to the Apache Software Foundation (ASF) under on ...

  7. 启用aspnet

    1. 进入dotnetfw目录 cd C:\WINDOWS\Microsoft.NET\Framework\v2.0.50727 2. aspnet_regiis -i -enable

  8. 玩转html5<canvas>画图

    导航 前言 基本知识 绘制矩形 清除矩形区域 圆弧 路径 绘制线段 绘制贝塞尔曲线 线性渐变 径向渐变(发散) 图形变形(平移.旋转.缩放) 矩阵变换(图形变形的机制) 图形组合 给图形绘制阴影 绘制 ...

  9. postgresql 字符串拼接"||“的使用

    不过注意这里的只有postgresql可以使用,其他数据库不明. select name || remark as newname from mytable where name like '%tes ...

  10. Unity3D 之3D动画机设置

    新建一个动画机 然后创建一些动画的属性 每根线都是一个动画到下一个动画的转变,动画的转变是基于条件的. 1.通过建立Parameters设定动画的转换条件 2.右边的Conditions设定可以设定是 ...