15158846557 在线咨询 在线咨询
15158846557 在线咨询
所在位置: 首页 > 营销资讯 > 网站运营 > 制作网页评论代码(javascript)

制作网页评论代码(javascript)

时间:2023-08-10 01:27:02 | 来源:网站运营

时间:2023-08-10 01:27:02 来源:网站运营

制作网页评论代码(javascript):代码思路:

①、首先在html代码部分创建两个文本框及一个提交按钮。

②、在javascript中利用id属性查找这些标签节点。

③、给提交按钮绑定一个点击事件(click)。

④、利用获取到节点的value属性来获取文本框的内容,将内容返回到页面。

<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>评论区留言</title> <style type="text/css"> .div1,div{ width: 1350px; margin:0 auto; } </style></head><body> <div class="div1" id="div1"> <!-- 创建昵称和留言文本框 --> <span>昵称</span><input type="text" id="user" name="user"> <br> <span>留言</span><textarea id="lang"></textarea><br> <!-- 创建提交评价按钮 --> <input type="button" value="提交评价" id="btn"> </div></body><script type="text/javascript"> //通过id属性查找标签节点 var user=document.getElementById('user'); var lang=document.getElementById('lang'); //通过id属性查找提交评价按钮并绑定点击事件 document.getElementById('btn').onclick=function(){ //在html代码中创建一个div盒子 var cont=document.createElement('div'); //将获取到的数据,放到一创建好的盒子中 cont.innerHTML='<p>'+user.value+':'+lang.value+'</p><hr>'; //将创建好的div盒子及及内容显示在页面中 document.getElementById('div1').appendChild(cont); user.value=''; lang.value=''; }</script></html>

代码效果视屏:



关键词:评论

74
73
25
news

版权所有© 亿企邦 1997-2025 保留一切法律许可权利。

为了最佳展示效果,本站不支持IE9及以下版本的浏览器,建议您使用谷歌Chrome浏览器。 点击下载Chrome浏览器
关闭