<!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. What floating point types are available in .NET?

    The C# standard only lists double and float as floating points available (those being the C# shortha ...

  2. leetcode:Search for a Range（数组，二分查找）

    Given a sorted array of integers, find the starting and ending position of a given target value. You ...

  3. Selenium系列教程(2)

    Selenium RC(Selenium远程控制) Selenium RC是一个用Java编写的,允许用户使用无论哪种编程语言对基于Web的应用程序构建测试脚本的工具.Selenium RC克服了Se ...

  4. HeadFirst jsp 03 (MVC)

    创建一个小的 web 应用, mvc, 麻雀虽小, 五脏俱全 补1: servlet没有main()方法, 他们受控与另外一个Java应用, 这个Java应用称为 容器, tomcat就是这么一个容器 ...

  5. 转：最值得学习阅读的10个C语言开源项目代码

    阅读优秀代码是提高开发人员修为的一种捷径……  1. Webbench Webbench是一个在linux下使用的非常简单的网站压测工具.它使用fork()模拟多个客户端同时访问我们设定的URL,测试 ...

  6. Python3 学习第十弹： 模块学习三之数字处理

    math模块 提供基础的数学函数, cos(3.14) = -0.999..(弧度制) acos(1) = 0.0 sqrt(9) = 3.0 degrees(3.14) = 179.9999..(弧 ...

  7. 【笨嘴拙舌WINDOWS】BMP图片浏览器

    要将文件显示成图片这其中需要经过 1.将磁盘文件内容读取到内存: 2.将文件对应内存里包含的像素为以及像素信息转化为显示驱动器能理解的格式: 3.将转化过后的内存送到显卡的缓存区 4.显示器读取缓存现 ...

  8. UVa 101 The Blocks Problem

    题意:给出从左到右放置的n块木块(从0开始编号),再给出四种操作,再给出相应的操作,输出操作结束后每一堆木块的情况. 学习的紫书,因为每一堆的木块数是在发生变化的,所以用vector. 然后就是模拟几 ...

  9. Wireshark基本介绍和学习TCP三次握手(转)

    http://www.cnblogs.com/TankXiao/archive/2012/10/10/2711777.html 之前写过一篇博客:用 Fiddler 来调试HTTP,HTTPS. 这篇 ...

  10. eclipse 报错 import ... cannot be resolved 处理方法

    项目上右键,properties, 找java build path,切到libraies标签,将爆红的jdk编辑一下,选用你需要的jdk版本,一般1..我看你类的httpServlet报错,也是这个 ...