javascript留言板
用DOM相关方法创建的留言板
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
#ul1 {margin:0; padding:0;}
#ul1 li {list-style:none; width:300px; background:#CCC; border:1px solid #999; position:relative;}
#ul1 li h2 {display:inline-block;}
#ul1 li p {display:inline-block;}
#ul1 li a {position:absolute; right:4px; bottom:4px;}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
window.onload=function (){
var oName=document.getElementById('name');
var oContent=document.getElementById('content');
var oUl=document.getElementById('ul1');
var oBtn=document.getElementById('btn1');
var aLi=oUl.getElementsByTagName('li');
var oLi=null; oBtn.onclick=function (){
oLi=document.createElement('li');
var oH2=document.createElement('h2');
var oP=document.createElement('p');
var oA=document.createElement('a'); oH2.innerHTML=oName.value+':';
oP.innerHTML=oContent.value;
oA.innerHTML='删除';
oA.href='javascript:;';
oA.onclick=function (){
oUl.removeChild(this.parentNode);
}; oLi.appendChild(oH2);
oLi.appendChild(oP);
oLi.appendChild(oA); if(aLi.length>0){
oUl.insertBefore(oLi, aLi[0]); //确保新添加的在最前面
}
else{
oUl.appendChild(oLi);
}
};
};
</script>
</head>
<body>
姓名:<input id="name" type="text" /><br />
内容:<textarea id="content" rows="5" cols="40"></textarea><br />
<input id="btn1" type="button" value="留言" />
<ul id="ul1">
</ul>
</body>
</html>
javascript留言板的更多相关文章
- JavaScript学习笔记(三)——留言板知操纵DOM节点
用JavaScript写了一个简易的留言板,暂不涉及数据库接入等. 1.功能以及流程 主要功能即为留言,用两个文本框接受用户输入的用户名以及留言内容,然后通过"提交留言"按钮将用户 ...
- javaScript简单的留言板
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- JavaScript+IndexedDB实现留言板:客户端存储数据
之前看到贴友有问:用js怎么实现留言板效果.当时也写了一个,但是没有实现数据存储:http://www.ido321.com/591.html 现在将之前的改写一下,原来的HTML布局不变,为了防止G ...
- dd——留言板再加验证码功能
1.找到后台-核心-频道模型-自定义表单 2.然后点击增加新的自定义表单 diyid 这个,不管他,默认就好 自定义表单名称 这个的话,比如你要加个留言板还是投诉建议?写上去呗 数据表 这个不要碰, ...
- html的留言板制作(js)
这次留言板运用到了最基础的localstorage的本地存储,展现的效果主要有: 1.编写留言2.留言前可以编辑自己的留言昵称.不足之处: 1.未能做出我喜欢的类似于网易的叠楼功能. 2.未能显示评论 ...
- 11月8日PHP练习《留言板》
一.要求 二.示例页面 三.网页代码及网页显示 1.denglu.php 登录页面 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tran ...
- LigerUi框架+jquery+ajax无刷新留言板系统的实现
前些天发布了LigerUi框架的增.删.改代码,一堆代码真的也没一张图片.有的网友推荐上图,所有今天把涉及到这个框架的开源的留言板共享给大家.在修改的过程中可能有些不足的地方希望大家拍砖. 因为留言板 ...
- tp框架做留言板
首先是登录的LoginController.class.php 代码内容是 <?php namespace Admin\Controller; use Think\Controller; cla ...
- 数据库留言板例题:session和cookie区别
session和cookie区别: <?php session_start(); //session_start();必须写在所有的php代码前边 ?> <!DOCTYPE html ...
随机推荐
- android 使某个控件获取焦点
比如让某个edittext获取焦点,可以调用edittext.requestfocuse()的方法
- boost::bind
bind并不是一个单独的类或函数,而是非常庞大的家族,依据绑定的参数个数和要绑定的调用对象类型,总共有十个不同的形式,但它们的名字都叫bind. bind接受的第一个参数必须是一个可调用对象f,包括函 ...
- EXT经验--在调试中通过查看handler的第一个参数的xtype得知该参数信息及该handler的归属
EXT模拟了OPP的思想,因此很多问题可以像JAVA语音那样去思考它.在实际阅读EXT时,常常需要我们搞清楚某个函数.某个对象的归属.如某个参数变量.方法属于哪个类,如下: 这是我今天在群中发出的问题 ...
- css文件都写在一个里面还是每个页面都引用单独的css样式好?
因为网站比较小,外加网站页面有很多重复构件,决定采用“构件复用”搭建网页,但是遇到了一个问题.因为虽然有共同的css,但是每个页面或多或少都有独立的样式控制,到底是写在同一个css还是分离看上去清楚一 ...
- [转载]C#如何在webBrowser1控件通过TagName,Name查找元素(没有ID时)遍历窗体元素
//防止页面多次刷新页面执行 ) { string GetUserName = System.Configuration.ConfigurationSettings.AppSettings[" ...
- [设计模式] 19 观察者模式 Observer Pattern
在GOF的<设计模式:可复用面向对象软件的基础>一书中对观察者模式是这样说的:定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都得到通知并被自动更新.当一个 ...
- LA 4384
扩展欧几里得 #include<cstdio> #include<cstring> #include<cmath> #include<algorithm> ...
- 【设计模式六大原则3】依赖倒置原则(Dependence Inversion Principle)
定义:高层模块不应该依赖低层模块,二者都应该依赖其抽象:抽象不应该依赖细节:细节应该依赖抽象. 问题由来:类A直接依赖类B,假如要将类A改为依赖类C,则必须通过修改类A的代码来达成.这种场景下,类 ...
- POJ 3641
Pseudoprime numbers Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 6044 Accepted: 24 ...
- java001-Helloworld
public class test05 { public static void main(String[] args) { System.out.println("Hello World! ...