案例:无刷新评论---属于创建对象的案例拿出来复习

创建行和单元格,添加到相应元素中,设置内容 createElement, appendChild,innerHTML

<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<title>title</title>
</head> <body>
<table id="tb" border="1">
<tbody id="tbd">
<tr>
<td>猪猪:</td>
<td>我喜欢吃肉</td>
</tr>
</tbody>
</table>
<div>
昵称:<input type="text" value="" id="userName" /><br />
<textarea name="" id="tt" cols="30" rows="10"></textarea><br />
<input type="button" value="评论一下" id="btn" /><br />
</div>
<script src="common.js"></script>
<script>
//获取按钮,注册点击事件
document.getElementById("btn").onclick = function () {
//获取昵称
var userName = my$("userName");
//获取评论
var tt = my$("tt");
//创建行
var tr = document.createElement("tr");
//行加到tbody中
my$("tbd").appendChild(tr);
//创建单元格td1,并添加到行
var td1 = document.createElement("td");
tr.appendChild(td1);
td1.innerHTML = userName.value;
//创建单元格td2,并添加到行
var td2 = document.createElement("td");
tr.appendChild(td2);
td2.innerHTML = tt.value;
//清空
userName.value = "";
tt.value = "";
};
</script> </body> </html>

JS---案例:无刷新评论---属于创建对象的案例拿出来复习的更多相关文章

  1. jQuery 无刷新评论

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 纯js异步无刷新请求(只支持IE)

    纯js异步无刷新请求 下载地址:http://pan.baidu.com/s/1slakL1F 所以因为非IE浏览器都禁止跨域请求,所以以只支持IE. <HTML> <!-- 乱码( ...

  3. 纯js异步无刷新请求(只支持IE)【原】

    纯js异步无刷新请求 下载地址:http://pan.baidu.com/s/1slakL1F 所以因为非IE浏览器都禁止跨域请求,所以以只支持IE. <HTML> <!-- 乱码( ...

  4. ajax无刷新评论示例

    下面就为大家带来一篇 ajax无刷新评论示例.学习还是有点帮助的,给大家做个参考吧. 这是留言板的界面,当用户点击提交留言的时候,自动提交到我的留言下面 留言内容中为空,或者为灰色的“没有填写留言内容 ...

  5. js实现无刷新表单提交文件,将ajax请求转换为form请求方法

    最近在做项目的时候遇到一个需要上传文件的需求,因为ajax请求是无法上传二进制文件流的,所以只能用form表单提交,而form提交有一个问题就是会使页面刷新,本文解决了form表单提交文件时页面刷新的 ...

  6. history.js 一个无刷新就可改变浏览器栏地址的插件(不依赖jquery)

    示例: http://browserstate.github.io/history.js/demo/     简介   HTML4有一些对浏览历史的前进后退API的支持如:   window.hist ...

  7. js实现无刷新上传

    在新增数据项的时候,用ajax实现无刷新提交,但上传文件的时候,由于数据类型原因,不能将页面的<asp:FileUpload>中以字符串值的方式传到js里调用.我一共找到了两个方法予以解决 ...

  8. 案例(JQuery的ajax无刷新评论)

    CommentsTest.html代码: <head> <meta http-equiv="Content-Type" content="text/ht ...

  9. Ajax制作无刷新评论系统

    index.html <script src="jquery.min.js"></script> <script> $(function(){ ...

随机推荐

  1. pycharm远程调试和debug

    目的:     通过pycharm远程连接服务器,实现在pycharm上开发,代码同步到服务器(或者可以从服务器download到pycharm),利用服务器开发环境在pycharm上debug.   ...

  2. 浏览器禁用Cookie后的Session处理

    1. 实现购物车, 可以基于Cookie, 也可以基于Session, 若服务器性能较差, 可以考虑基于Cookie实现购物车 2. 解决方案: URL重写 把用户可能点的每一个超链接后面,都跟上用户 ...

  3. 阿里云 Aliplayer高级功能介绍(四):直播时移

    基本介绍 时移直播基于常规的HLS视频直播,直播推流被切分成TS分片,通过HLS协议向播放用户分发,用户请求的m3u8播放文件中包含不断刷新的TS分片地址:对于常规的HLS直播而言,TS分片地址及相应 ...

  4. 基于SpringBoot+AntDesign的快速开发平台,JeecgBoot 2.0.2 版本发布

    Jeecg-Boot 是一款基于SpringBoot+代码生成器的快速开发平台! 采用前后端分离架构:SpringBoot,Ant-Design-Vue,Mybatis,Shiro,JWT. 强大的代 ...

  5. 移动端开发框架Zepto.js

    一.概述 Zepto.js是一个轻量的js库,它与jQuery有类似的API. zepto的设计目的是不到10K的通用库,快速下载,有一个熟悉的api-->精力专注在开发上. 流行起来的原因:轻 ...

  6. 左神算法进阶班8_1数组中累加和小于等于aim的最长子数组

    [题目] 给定一个数组arr,全是正数:一个整数aim,求累加和小于等于aim的,最长子数组,要求额外空间复杂度O(1),时间复杂度O(N) [题解] 使用窗口: 双指针,当sum <= aim ...

  7. 《DSP using MATLAB》Problem 7.35

    代码: %% ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ %% Output In ...

  8. RQNOJ--160 竞赛真理(01背包)

    题目http://www.rqnoj.cn/problem/160 分析:这是一个01背包问题,对于每一道题目,都有两个选择"做"或者"不做". 但是唯一不同的 ...

  9. 2018-8-10-win10-uwp-手把手教你使用-asp-dotnet-core-做-cs-程序

    title author date CreateTime categories win10 uwp 手把手教你使用 asp dotnet core 做 cs 程序 lindexi 2018-08-10 ...

  10. Collection接口和Map接口