<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

<script type="text/javascript">

window.onload = function ()

{

    var otext = document.getElementsByTagName('input')[0];

    var obtn = document.getElementsByTagName('input')[1];

    var oul = document.getElementById('ul1');

    var n = 5;

    obtn.onclick = function ()

    {

        if(!otext.value)

        {

            return;

        }

        var oli = document.createElement('li');

        oli.innerHTML = otext.value;

        if(oul.children[0])

        {

            oul.insertBefore(oli,oul.children[0]);

        }

        else

        {

            oul.appendChild(oli);

        }

        if(oul.children[n])

        {

            oul.removeChild(oul.children[n]);

        }

        otext.value = '';

    }

};

</script>

</head>

<body>

<input type="text">

<input type="button" value="留言">

<ul id="ul1">

</ul>

</body>

</html>

dom 学习的开始~简单留言1的更多相关文章

  1. 前端基础-BOM和DOM学习

    JavaScript分为 ECMAScript,BOM,DOM. BOM:是指浏览器对象模型,使JavaScript有能力与浏览器进行对象. DOM:是指文档对象模型,通过它,可以访问HTML文档的所 ...

  2. HTML DOM 学习

    HTML DOM 学习 By: Mirror王宇阳 E-mail:2821319009@qq.com 博客主页:https://www.cnblogs.com/wangyuyang1016/ DOM ...

  3. JSP学习笔记(三):简单的Tomcat Web服务器

    注意:每次对Tomcat配置文件进行修改后,必须重启Tomcat 在E盘的DATA文件夹中创建TomcatDemo文件夹,并将Tomcat安装路径下的webapps/ROOT中的WEB-INF文件夹复 ...

  4. cookie的简单留言框

    我们在网页浏览时退出后,再次进入时会有上次的记录,这就用的上cookie属性了,cookie就是服务器暂存放在你计算机上的一笔资料,好让服务器用来辨认你的计算机.当你在浏览网站的时候,Web服务器会先 ...

  5. Hibernate二次学习一----------Hibernate简单搭建

    因为博客园自带的markdown不太好用,因此所有markdown笔记都使用cmd_markdown发布 Hibernate二次学习一----------Hibernate简单搭建: https:// ...

  6. JAVA WEB学习笔记(三):简单的基于Tomcat的Web页面

    注意:每次对Tomcat配置文件进行修改后,必须重启Tomcat 在E盘的DATA文件夹中创建TomcatDemo文件夹,并将Tomcat安装路径下的webapps/ROOT中的WEB-INF文件夹复 ...

  7. oracle学习 第一章 简单的查询语句 ——03

    1.1最简单的查询语句 例 1-1 SQL> select * from emp; 例 1-1 结果 这里的 * 号表示全部的列.它与在select 之后列出全部的列名是一样的.查询语句以分号( ...

  8. Spark学习笔记0——简单了解和技术架构

    目录 Spark学习笔记0--简单了解和技术架构 什么是Spark 技术架构和软件栈 Spark Core Spark SQL Spark Streaming MLlib GraphX 集群管理器 受 ...

  9. Html学习笔记(二) 简单标签

    标签的重点 标签的用途 标签在浏览器中的默认样式 <body>标签: 在网页上显示的内容 <p>标签: 添加段落 <hx>标签: 添加标题 标签一共有6个,h1.h ...

随机推荐

  1. 10.10 dos实验

    一. 实验目的 (1)认识DOS: (2)掌握命令解释程序的原理: (3)掌握简单的DOS调用方法: (4)掌握C语言编程初步. 二. 实验内容和要求 编写类似于DOS,UNIX的命令行解释程序 (1 ...

  2. ionic中极光推送的集成

    1.到极光官网注册账号,新建应用获得appkey. 详见:https://www.jiguang.cn/app/list 2.引入jpush插件 详见:https://github.com/jpush ...

  3. 设置sudo不输入密码 sudoers 编辑出错后的补救方法

    一 设置sudo为不需要密码 有时候我们只需要执行一条root权限的命令也要su到root,是不是有些不方便?这时可以用sudo代替.默认新建的用户不在sudo组,需要编辑/etc/sudoers文件 ...

  4. BZOJ 1003 物流运输

    最短路+dp. #include<iostream> #include<cstdio> #include<cstring> #include<algorith ...

  5. QCon 2015 阅读笔记 - 移动开发最佳实践

    所有ppt下载地址:http://pan.baidu.com/s/1mg9o4TM 下面是移动开发实践部分的阅读笔记. 移动开发网络性能优化实践 - 陈浩然 (携程) 携程是非常标准的移动App架构, ...

  6. HDU2102 A计划

    解题思路:一道简单题,却WA了十几发,犯几个低级错误.还是不能急躁,     内心要平静,具体分析见代码: #include<iostream> #include<cstdio> ...

  7. vector & array

    private static const NUM_LOOPS:int = 15; public function VectorTest():void { var vector:Vector.<i ...

  8. 获取当前匹配元素 包括自身的html

    $(".test").prop("outerHTML"); 来自为知笔记(Wiz)

  9. .htaccess 文件的使用

    用于服务器对文件夹的控制 官方解释为 :分布式配置文件 ,提供了针对目录改变配置的方法; 项目可以有多个这样的配置文件,子目录文件会覆盖父目录的配置 在apache(这里泛指服务器)中,/conf/v ...

  10. RAC 环境下修改归档模式

    RAC环境下的归档模式切换与单实例稍有不同,主要是共享存储所产生的差异.在这种情况下,我们可以将RAC数据库切换到非集群状态下,仅仅在一个实例上来实施归档模式切换即可完成RAC数据库的归档模式转换问题 ...