-->

  • 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. [转]Unity批量制作预制物体Prefab

    http://www.u3dblog.com/?p=441 有时候场景中一大批物体都需要制作成预制物体,但是unity只能手动一个一个的创建,感觉非常的蹩脚,下面一个编辑器类的方法解决你的麻烦. st ...

  2. jQuery -&gt; 获取/设置/删除DOM元素的属性

    jQuery的属性操作很easy,以下以一个a元素来说明属性的获取/设置/删除操作 <body> <a>jquery.com</a> </body> 加 ...

  3. [Javascript] Ex: concatAll, map and filter

    concatAll: Array.prototype.concatAll = function() { var results = []; this.forEach(function(subArray ...

  4. Java从设计模式[本场比赛状态转换武器]状态分析(State)模式

    如果我们正在做一个实时战略游戏.我们设计了一个武器,他制作只是当步兵,但他能够切换武器.第一个开关会变成弓箭手,第二个开关导通控股装甲盾牌,第三开关变成步兵--如何实现这一目标切换机构?我们开始思考, ...

  5. Android5.0之Activity的转场动画

    Activity的转场动画很早就有,但是太过于单调,样式也不好看,于是Google在Android5.0之后,又推出的新的转场动画,效果还是非常炫的,今天我们一起来看一下. 1.旧转场动画回顾 首先我 ...

  6. C++ notes for beginners

    作者:马 岩(Furzoom) (http://www.cnblogs.com/furzoom/)版权声明:本文的版权归作者与博客园共同所有.转载时请在明显地方注明本文的详细链接,未经作者同意请不要删 ...

  7. YII中路径别名

    路径别名 system:代表framework目录 system.web:代表framework/web目录 zii:代表framework/zii目录 webroot:代表项目下的app目录(htt ...

  8. webstom 配置git 后左侧菜单栏配色调整

    ws配置了git进行版本管理,但是最近改了主题,发现左侧列表的文件名的颜色都是一个颜色了.我想要的是,对未提交的文件用颜色区分,新建的,修改的,冲突的分别设置不同的颜色,不知在哪里能设置,求助 老规矩 ...

  9. (转) ASP.NET反射

    原文:http://www.cnblogs.com/zizo/p/3509895.html 两个现实中的例子:1.B超:大家体检的时候大概都做过B超吧,B超可以透过肚皮探测到你内脏的生理情况.这是如何 ...

  10. 强大的游戏开发工具Unity3D推出2D开发工具,unity将混合3D与2D开发

    2013 Unity全球开发者大会(Unite 2013)于2013年8月28日在温哥华隆重开幕,会上Unity全球CEO David Helgason在Keynote上宣布Unity 4.3版本即将 ...