无刷新视频评论

最新推荐文章于 2024-05-24 21:32:07 发布

胖胖爱家

最新推荐文章于 2024-05-24 21:32:07 发布

阅读量595

点赞数

分类专栏： js / jq / vue 文章标签： xhtml button javascript input html border

本文链接：https://blog.csdn.net/yual365/article/details/6783918

版权

js / jq / vue 专栏收录该内容

85 篇文章 0 订阅

订阅专栏

两种思路，一样的效果

方法一：

<!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-Type" content="text/html; charset=utf-8" />
<title>无刷新视频评论-</title>
<script type="text/javascript">
function addComment(){
var nickname = document.getElementById('nickname').value;//获取昵称
var comment = document.getElementById('comment').value;//获取评论的帖子

var tableComment = document.getElementById("tableComment");//定位到该元素
var tr = document.createElement("tr");//创建tr

var tdNickName = document.createElement("td");//创建td元素
tdNickName.innerText = nickname;//td中加入内容
tr.appendChild(tdNickName);//td放入的tr中

var tdComment = document.createElement("td");//创建td元素
tdComment.innerText = comment;//td中加入内容
tr.appendChild(tdComment);//td放入的tr中

tableComment.tBodies[0].appendChild(tr);
}

</script>
</head>
<body>

<p>评论区</p>
<table id="tableComment">
<tbody>
<tr><td>加菲猫</td><td>毛毛</td></tr>
</tbody>
</table>
昵称：<input type="text" id="nickname" /><br />
<textarea id="comment"></textarea><br />
<input type="button" value="评论" οnclick="addComment()"/>
</body>

</html>

方法二：

<!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-Type" content="text/html; charset=utf-8" />
<title>演示文档</title>
<script type="text/javascript" language=javascript>
   function addcomment(){
   var nickname=document.getElementById("nickname").value;
   var comment=document.getElementById("comment").value;

   var tablecomment=document.getElementById("tablecomment");
   var tr=tablecomment.insertRow(-1);
   var td1=tr.insertCell(-1);
   td1.innerText=nickname;
   var td2=tr.insertCell(-1);
   td2.innerText=comment;
   }
   </script>

</head>
<body>
<p>评论区：</p>
<table id="tablecomment" border=5>
   <tbody>
   <tr><td >喵喵：</td><td >shafa!</td></tr>
   </tbody>
</table>
呢称：<input id="nickname" type=text maxlength=10/><br />
评论：<textarea id="comment"></textarea><br />
<input type=button value="提交" οnclick="addcomment()" />

</body>
</html>