首页 > 编程 > JavaScript > 正文

JavaScript简单实现的仿微博留言功能示例

2019-11-19 12:16:47
字体:
来源:转载
供稿:网友

本文实例讲述了JavaScript简单实现的仿微博留言功能。分享给大家供大家参考,具体如下:

<!DOCTYPE html><html lang="en"><head>  <meta charset="UTF-8">  <title>微博留言</title></head><script>window.onload=function(){  var text=document.getElementById('text');  var btn =document.getElementById('btn');  var oul =document.getElementsByClassName('content')[0];  btn.onclick=function(){    var oli= document.createElement('li')    oli.innerHTML=text.value;    var arr= document.getElementsByTagName('li');    if(arr.length>0){      oul.insertBefore(oli,arr[0])    }else{      oul.appendChild(oli)    }  }}</script><body>  <input type="text" placeholder="请输入您的留言" id="text" />  <input type="button" value="留言" id="btn">  <ul class="content">  </ul></body></html>

使用在线HTML/CSS/JavaScript代码运行工具http://tools.VeVB.COm/code/HtmlJsRun测试上述代码,可得如下运行结果:

更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript操作DOM技巧总结》、《JavaScript页面元素操作技巧总结》、《JavaScript事件相关操作与技巧大全》、《JavaScript查找算法技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript错误与调试技巧总结

希望本文所述对大家JavaScript程序设计有所帮助。

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表