javascript 获取多条数据(模拟ajax获取数据)

更新时间：2009年06月01日 01:42:27 作者：

javascript 获取多条数据(模拟ajax获取数据),这样的好处不用额外的ajax读取链接，减轻服务器负担。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>guestbook demo</title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <meta name="Author" content="Sheneyan" /> <script type="text/javascript"> var data = [ { id:11, name:'路人甲', mail:'somebodyA@foo.com', title:'测试一下这个留言板好用不', content:'测试就是测试，不要问我为什么测试，也不要问我为了什么测试，反正我就是要测试，你能把我怎么着？', time:'2007-03-21 12:33:43' }, { id:12, name:'路人乙', mail:'somebodyB@foo.com', title:'你好，麻烦你一件事', content:'你好，你能告诉我你的QQ吗？我有事麻烦你', time:'2007-03-22 22:33:43' }, { id:13, name:'路人丙', mail:'somebodyC@foo.com', title:'啊啊啊', content:'世界如此美好，我脾气如此暴躁，这样不好~不好~~', time:'2007-03-23 12:03:41' }, { id:14, name:'路人丁', mail:'somebodyD@foo.com', title:'...', content:'其实。。。我是一个演员', time:'2007-03-23 22:04:08' }, { id:15, name:'xxx', mail:'armyA@foo.com', title:'xxx', content:'长夜漫漫无新睡眠，咦，怎么先生你也没睡？', time:'2007-03-24 11:12:55' } ]; function getMutliData(){ var x = p = document.getElementById('post'); for (var i = 0 ; i < data.length ; i ++){ var o = p.cloneNode(true); if (x.nextSibling) x.parentNode.insertBefore(o,x.nextSibling); else x.parentNode.appendChild(o); var t = o.innerHTML; t = t.replace(//g,function(a,b){ var v = ""; try{ v = eval("data["+i+"]."+b); } catch(e){} return v; }); o.innerHTML = t; x = o; } p.style.display='none'; } </script> </head> <body> <div id="post"> <fieldset> <legend id="post_header">()<a href='mailto:'></a>于发表：</legend> <h4 id="post_title"></h4> <p id="post_content"></p> </fieldset> </div> <button onclick="getMutliData()">获取多条数据(模拟ajax获取数据)</button> </body> </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

您可能感兴趣的文章:

微信小程序商品详情页的底部弹出框效果
这篇文章主要为大家详细介绍了微信小程序商品详情页的底部弹出框效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2018-04-04
JS 页面内容搜索，类似于 Ctrl+F功能的实现代码
JS 页面内容搜索，类似于 Ctrl+F功能的实现代码...
2007-08-08
input 获取光标位置设置光标位置方案
这篇文章主要为大家介绍了input 获取光标位置设置光标位置方案详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
2023-06-06
轻量级 JS ToolTip提示效果
JS ToolTip提示效果，喜欢的朋友可以参考下。
2010-07-07
动态添加删除表格行的js实现代码
本篇文章主要是对动态添加删除表格行的js实现代码进行了介绍，需要的朋友可以过来参考下，希望对大家有所帮助
2014-02-02
5分钟快速搭建vue3+ts+vite+pinia项目
本文主要介绍了5分钟快速搭建vue3+ts+vite+pinia项目，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2023-05-05
JavaScript实现拖拽和缩放效果
这篇文章主要为大家详细介绍了JavaScript实现拖拽和缩放效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2020-08-08
JS实现三级折叠菜单特效，其它级可自动收缩
这篇文章主要介绍了JS实现三级折叠菜单特效，其它级可自动收缩,需要的朋友可以参考下
2015-08-08
JavaScript弹簧振子超简洁版完全符合能量守恒,胡克定理
完全符合能量守恒,胡克定理的JavaScript弹簧振子(超简洁版,超越第一版!)
2009-10-10
js 回车提交表单两种实现方法
js 回车提交一些新手朋友还是比较陌生的，本文介绍两种实现方法:jQuery方法、JavaScript方法,感兴趣的朋友可以研究下
2012-12-12