<!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. SQLServer2008 行转列2

    with a as ( select numb,name,row_number() over( partition by numb order by name desc) rowid from fen ...

  2. 二、理解over()函数

    1.1.两个order by的执行时机分析函数是在整个sql查询结束后(sql语句中的order by的执行比较特殊)再进行的操作, 也就是说sql语句中的order by也会影响分析函数的执行结果: ...

  3. C#处理文件流的转换

    //----引入必要的命名空间 using System.IO; using System.Drawing.Imaging; //----代码部分----// private byte[] photo ...

  4. linux下使用svn

    安装:apt-get install subversion CHECKOUT 将文件checkout到本地目录 svn checkout path(path是服务器上的目录)例如:svn checko ...

  5. core--线程状态

    线程的状态在我看来就只有两种:1运行,2休眠.这两种状态的切换是如何实现的呢? Sleep(毫秒) CreateThread时传入CREATE_SUSPENDED标识 SuspendThread(ha ...

  6. Dom文档模型

    文档对象模型     通过 JavaScript,您可以重构整个 HTML 文档.您可以添加.移除.改变或重排页面上的项目.要改变页面的某个东西,JavaScript 就需要获得对 HTML 文档中所 ...

  7. Linux Shell编程(4): 逻辑运算符、逻辑表达式详解

    shell的逻辑运算符 涉及有以下几种类型,因此只要适当选择,可以解决我们很多复杂的判断,达到事半功倍效果. 一.逻辑运算符 逻辑卷标 表示意思 1. 关于档案与目录的侦测逻辑卷标! -f 常用!侦测 ...

  8. java生成简单Excel工作薄

    前言: 代码都是建立在实际需求上的,上周做完一个调外部电影券接口的项目,这周产品又要excel表格,大致内容为:券所属影院.图片URL.等信息制作为excel表格,把每次同步过来的数据给他分析. jx ...

  9. aspose.word 查找文本并加下划线

    private Run SplitRun(Run run, int position) { Run beforeRun = (Run)run.Clone(true); beforeRun.Text = ...

  10. Hibernate查询出现java.lang.IllegalArgumentException异常解决方法

    Hibernate查询出现java.lang.IllegalArgumentException. 异常信息如下:java.lang.IllegalArgumentException        at ...