简易留言板

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script>
window.onload = function(){
    var oTxt = document.getElementById(‘txt‘);
    var oBtn = document.getElementById(‘btn‘);
    var oBox = document.getElementById(‘box‘);
    
    oBtn.onclick = function(){
        var oLi = document.createElement(‘li‘);
        oLi.innerHTML = oTxt.value + ‘<a href="javascript:;">隐藏</a>‘;
        
        if(oBox.children.length){
            oBox.insertBefore(oLi,oBox.children[0]);    
        }else{
            oBox.appendChild(oLi);        
        }
        
        oTxt.value = ‘‘;
        oLi.children[0].onclick = function(){
            oBox.removeChild(this.parentNode);
        }
    }
}
</script>
</head>

<body>
user:<input type="text" value="" id="txt"/>
<input type="button" value="添加" id="btn"/>
<ul id="box"></ul>
</body>
</html>

时间： 2024-10-15 02:30:29

简易留言板的相关文章

JSP+Servlet+JavaBean传统方式实现简易留言板制作（注册、登录、留言）

学JavaEE也有一段时间了,跟着老师和教材做了不少东西,但是一直以来没时间写博客,今天就把以前写的一个简易留言板简单发一下吧. 开发工具 主要用的开发工具为 MyEclipse(2014.2016均可).Tomcat 7.0.SQL Server 2016.SSMS数据库管理工具.浏览器等. 开发环境 开发环境为windows系统,已安装配置Java最新版开发环境. 主要功能与语言 登录.注册.并可以在留言板留言,所有留言内容均可见. 所采用JSP+Servlet+JavaBean传统方式,仅

6.2.13 简易留言板

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>留言板</title> </head> <body> <h1>简易留言板</h1> <div id="box"> <!--<ul> </ul>--> </div> <

DOM操作相关案例 模态对话框,简易留言板,js模拟选择器hover,tab选项卡,购物车案例

1.模态框案例 需求: 打开网页时有一个普通的按钮,点击当前按钮显示一个背景图,中心并弹出一个弹出框,点击X的时候会关闭当前的模态框 代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> *{ padding: 0; margin: 0; }

php实现简易留言板效果

首先是Index页面效果图 index.php <?php header('content-type:text/html;charset=utf-8'); date_default_timezone_set('PRC'); $filename="msg.txt"; $msgs=[]; //检测文件是否存在 if(file_exists($filename)){ //读取文件中的内容 $string=file_get_contents($filename); if(strlen($

微信小程序实现简易留言板

微信小程序现在很火,于是也就玩玩,做了一个简易的留言板,让大家看看,你们会说no picture you say a j8 a,好吧先上图. 样子就是的,功能一目了然,下面我们就贴实现的代码,首先是HTML页面,好吧,其实微信小程序的是wxml(微信ml)总感觉怪怪的,有木有. 1 <!--index.wxml--> 2 <view class="msg-box"> 3 <!--留言--> 4 <view class="send-bo

element-ui + vue 简易留言板

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>留言板</title> <!-- 引入样式 --> <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-default/index.css"> <

jsp做的一个简易留言板功能

1.先登录才能留言 2.可以留言 3.可以回复 4.自己写的留言可以自己删除 5.留言进行分页显示,避免留言只能显示一部分 1.登录后会有 2.写留言 提交按钮在你没写东西前是不能提交的,用了onkeyup()方法 提交后马上显示在留言列表,ajax技术 相关代码: function sendtext(){ var text1=form1.textfield.value; if(text1!=""){ createRequest1("insert1.jsp?textfield

vue实现简易留言板

首先引入vue.js <script src="vue.js"></script> 布局 <div id="div"> <input type="text" v-model="username" @keyup.enter="add()"> <input type="button" value="按钮" @click

js简易留言板

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <link rel="stylesheet" type="text/css" href="css/reply.css"/> <body> <div id=&quo

js 实现简易留言板功能

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-