JavaScript实现网页留言板功能
更新时间：2020年11月23日 09:18:57 作者：我是Dreamer啊
这篇文章主要为大家详细介绍了JavaScript实现网页留言板功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
JavaScript(JS)网页–留言板，供大家参考，具体内容如下
在使用网页进行冲浪时，经常会发表自己的留言。发布留言的留言板是怎么做的呢？
制作一个简单的留言板。
首先需要一个textarea框，旁边放置一个按钮，然后需要一个ul标签，里面不需要放置li元素，用CSS加以简单的修饰。
紧接着获取元素，在点击按钮后，创建一个li，将文本框里面的赋值给li，将li插入到ul的第一个孩子的前面。
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>留言发布</title>
<style>
body {
margin: 200px;
}
*{
margin: 0px;
padding: 0px;
}
li {
list-style: none;
width: 500px;
height: 30px;
margin-top: 5px;
border: 1px solid black;
background-color: pink;
}
textarea{
width: 200px;
height: 80px;
}
</style>
</head>
<body>
<textarea name="" id=""></textarea>
<button>发布</button>
<ul>
</ul>
<script>
//获取元素
var btn = document.querySelector('button');
var text = document.querySelector('textarea');
var ul = document.querySelector('ul');
//注册时间
btn.onclick = function(){
if(text.value == ''){
alert("您没有输入内容。")
return false;
}else{
var li = document.createElement('li');
li.innerHTML = text.value;
//ul.appendChild(li);
ul.insertBefore(li,ul.children[0])
}
text.value='';
}
</script>
</body>
</html>
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了Javascript 闭包详解及实例代码的相关资料,闭包是一个特别抽象的概念，特别是ECMA规范给的定义，如果没有实战经验，很难从定义去理解它，需要的朋友可以参考下2016-11-11
这篇文章主要为大家详细介绍了bootstrap布局中input输入框右侧图标点击功能实现的相关代码，感兴趣的小伙伴们可以参考一下2016-05-05
这篇文章主要介绍了JS按字节截取字符长度实例，有需要的朋友可以参考一下2013-11-11
这篇文章主要为大家详细介绍了JS实现表单验证案例，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-08-08
这篇文章主要给大家介绍了关于微信小程序中数据处理的相关资料，文中介绍的非常详细，对大家具有一定的参考学习价值，需要的朋友可以参考借鉴，下面来一起看看吧。2017-07-07
这篇文章主要介绍了JS回调函数,结合实例形式深入分析了js回调函数的概念、原理、使用方法及相关操作注意事项,需要的朋友可以参考下2019-10-10
WebStorm ES6 语法支持设置&babel使用及自动编译(详解)
下面小编就为大家带来一篇WebStorm ES6 语法支持设置&babel使用及自动编译(详解)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-09-09
这篇文章主要为大家详细介绍了微信小程序实现拼图游戏，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-07-07
验证邮箱格式是否正确的方法有很多，接下来为大家介绍下使用js是如何做到的2013-12-12
这篇文章主要为大家详细介绍了JS实现多物体运动，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-05-05
最新评论