<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title></title>

    <script type="text/javascript">

        window.onload = function () {

            var oBtn = document.getElementById("btn");

            var oTxt = document.getElementById("txt1");

            var oUl = document.getElementById("ul1");

            oBtn.onclick = function () {

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

                var aLi = oUl.getElementsByTagName("li");

                oLi.innerHTML = oTxt.value;

                if (aLi[0].length > 0) {

                    //如果之前有元素则插入在前面

                    oUl.insertBefore(oLi, ali[0]);

                }

                else {

                    oUl.appendChild(oLi);

                }

            }

        }

    </script>

</head>

<body>

    <input type="text" value="" id="txt1" />

    <input type="button" value="创建" id="btn" />

    <ul id="ul1"></ul>

</body>

</html>

--拓展
Oul.removeChild(this.parentNode);

　　

javascript中创建插入元素的更多相关文章

  1. JavaScript中创建数组的方式！

    JavaScript中创建数组的方式! 利用数组字面量 // 1 直接量 console.log(Array.prototype); var arr = [1, 2, 4, 87432]; // 注意 ...

  2. JavaScript中创建类，赋值给ajax中的data参数

    缘由:因为要给根据是否选中checkbox来动态增加ajax中data的属性(ajax的data属性格式的几种方法,参考http://www.jb51.net/article/46676.htm) d ...

  3. JavaScript中创建字典对象（dictionary）实例

    这篇文章主要介绍了JavaScript中创建字典对象(dictionary)实例,本文直接给出了实现的源码,并给出了使用示例,需要的朋友可以参考下 对于JavaScript来说,其自身的Array对象 ...

  4. 简单使用JSON,JavaScript中创建 JSON 对象(一)

    JSON:JavaScript 对象表示法(JavaScript Object Notation). JSON 是存储和交换文本信息的语法.类似 XML. JSON 比 XML 更小.更快,更易解析. ...

  5. javascript中获取dom元素的高度和宽度

    javascript中获取dom元素高度和宽度的方法如下: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网 ...

  6. javascript中获取dom元素高度和宽度

    javascript中获取dom元素高度和宽度的方法如下: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网 ...

  7. js | javascript中获取dom元素的高度和宽度

    javascript中获取dom元素高度和宽度的方法如下: 网页可见区域宽: document.body.clientWidth网页可见区域高: document.body.clientHeight网 ...

  8. JavaScript中获取HTML元素的方式

    JavaScript中获取HTML元素的方式 1.使用id方式获取元素,返回一个具体对象   document.getElementById(id名) 2.使用className方式获取元素,返回类数 ...

  9. JavaScript中创建命名空间

    引用:http://ourjs.com/detail/538d8d024929582e6200000c   在JavaScript中全局变量经常会引起命名冲突,甚至有时侯重写变量也不是按照你想像中的顺 ...

随机推荐

  1. 记录一次会话CRT

    记录一次会话CRT --------------------- su -oracle sqlplus / as sysdba sqlplus username/password  如:普通用户登录   ...

  2. unity 3消 游戏

    3消游戏跟着智能手机流行到现在已经有很长一段时间,unity实现的3消 https://github.com/textcube/match3action 截图如下: 在阅读源码的时候不难发现,Game ...

  3. zedboard搭建交叉编译环境

    参考:http://blog.csdn.net/xzyiverson/article/details/11264417 我安装的LINUX12.04LTS 双系统 下载好交叉编译软件xilinx-20 ...

  4. 大神是如何玩C语言的！

    我在酷壳上看到一篇文章,C语言结构体里的成员数组和指针,看得感觉让我真是佩服地五体投地啊.皓哥虽说谦称自己不是高手啥的,但是写出这样的文章来,真是让我感觉自己的水平真是渣渣!我看完了感觉有点小激动,也 ...

  5. maven 相关

    maven相关 一 windows安装配置maven: 1. 官网下载最新版本maven,发布日志时为: maven3.2.1 2.解压maven到相应的目录:配置环境变量: MAVEN_HOME:D ...

  6. mysql怎么从1开始递增

    前提:使用SQLyog数据库管理工具 1.打开更改表: 2.点击表字段下方“高级属性”: 3.找到“自动递增”这一项,值改为1: 4.点击“确定”关闭高级属性表弹出框: 5.点击“Alter”关闭更改 ...

  7. jquery批量控制form禁用的代码

    jquery批量控制form禁用的代码. 代码: <script type="text/javascript" src="/jquery/jquery-1.8.2. ...

  8. Translation002—Package Index(Android包索引)

    !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! 看本翻译前请您注意: 本人初学android,可能有的翻译不是非常准确,但本人尽最大努力,不清楚处会做标记,并附 ...

  9. ASP.NET MVC4学习笔记之总体概述

    断断续续使用ASP.NET MVC框架也有一年多了,也算积累了一些经验,唉,一直想写一些笔记好好总结一下,人太懒不想动笔,今天终于决定开始.希望自己能坚持下去. 这篇文章大体介绍ASP.NET MVC ...

  10. C string 函数大全

    PS:本文包含了大部分strings函数的说明,并附带举例说明.本来想自己整理一下的,发现已经有前辈整理过了,就转了过来.修改了原文一些源码的问题,主要是用char *字义字符串的问题,导致程序运行时 ...