我们见过很多使用jsp ,php,asp的动态网页技术的网站了,我们知道如果一个网站内容更新频率极低,而内容量不是十分庞大时,这样的网站(一次开发完成后不会需要较多的维护成本)的完全可以使用全部使用静态页面来做,此时其实反而可以得到更好的效果(更快的响应时间(省掉了服务器各种拦截器,过滤器,数据库查询..),...)

有一个有趣的情形是,当需求没有那么复杂,你想要的真的非常清晰,非常直观,非常简单时,关于网站,我完全可以非常轻量级的非常惬意的去做这件事情,然后版本迭代,渐进增强,

我尝试着,可以使用json进行通用的数据传递,制定出一套数据的请求接口(ajax的url),这是一个思路再清晰不过的后台了

页面可以彻底使用静态的html,同样可以做到动态的数据,例如一个用户列表页和一个用户详情页,html技术里本身js即可以实现截获相应请求参数,异步请求,页面重定向等

//user_list页内
<a href="user_profile.html/?user_id=5">跳到user_profile页去</a> //user_progile页内
var req=window.location.search; //console.log('query:'+req);
var user_id=req.substr(1).substr(8); var profile="http://xxxxx.com/api/users/"+user_id+"/profile"; $.getJSON(
profile,
function(data){
console.log(data);
$('#nick_name').text(data.data.nickname);
});

当然这样做同样有非常多的不足之处,

但显而易见的一件事情是,少写了非常多的一堆代码,少用了一堆library,仍然快速搭建起了一个具体可用的网站,以一种触手可及信手拈来的方式.

静态页面之间的转发与json与ajax做到动态数据的更多相关文章

  1. JS控制静态页面之间传递参数获取参数并应用

    在项目中遇到这也一个问题: 有a.html和b.html. 1.a页面已经打开,b页面尚未打开,我希望在a页面设置好一些列参数,比如背景色,宽度等参数,传递给b页面,好让b页面在打开就能应用. 2.a ...

  2. 6 json和ajax传递api数据

    1 2 3 4 https://swapi.co/ <h1>Hello Reqwest!</h1> <script> var a = {} reqwest({ ur ...

  3. 使用Varnish+ESI实现静态页面的局部缓存(思路篇)

    使用Varnish+ESI实现静态页面的局部缓存(思路篇) 页面静态化是搭建高性能网站必用的招式之一,页面静态化可以有效提升系统响应速度,同时也有利于搜索引擎优化.但在页面静态化后,静态页面之间包含( ...

  4. 学习MVC之租房网站(十二)-缓存和静态页面

    在上一篇<学习MVC之租房网站(十一)-定时任务和云存储>学习了Quartz的使用.发邮件,并将通过UEditor上传的图片保存到云存储.在项目的最后,再学习优化网站性能的一些技术:缓存和 ...

  5. DataTables学习:从最基本的入门静态页面,使用ajax调用Json本地数据源实现前端开发深入学习,根据后台数据接口替换掉本地的json本地数据,以及报错的处理地方,8个例子(显示行附加信息,回调使用api,动态显示和隐藏列...),详细教程

    一.DataTables  个人觉得学习一门新的插件或者技术时候,官方文档是最根本的,入门最快的地方,但是有时候看完官方文档,一步步的动手写例子,总会出现各种莫名其妙的错误,需要我们很好的进行研究出错 ...

  6. 微信小程序(六) 文章详情静态页面detail

    文章详情静态页面detail:

  7. 阶段5 3.微服务项目【学成在线】_day09 课程预览 Eureka Feign_09-课程详情页面静态化-静态页面测试

    4 课程详情页面静态化 4.1 静态页面测试 4.1.1 页面内容组成 我们在编写一个页面时需要知道哪些信息是静态信息,哪些信息为动态信息,下图是页面的设计图: 打开静态页面,观察每部分的内容. 红色 ...

  8. 使用 Nginx 部署静态页面

    Nginx 介绍 Nginx 是俄罗斯人编写的十分轻量级的 HTTP 服务器, Nginx,它的发音为「engine X」,是一个高性能的 HTTP 和反向代理服务器,同时也是一个 IMAP/ POP ...

  9. 浅谈在静态页面上使用动态参数,会造成spider多次和重复抓取的解决方案

    原因: 早期由于搜索引擎蜘蛛的不完善,蜘蛛在爬行动态的url的时候很容易由于网站程序的不合理等原因造成蜘蛛迷路死循环. 所以蜘蛛为了避免之前现象就不读取动态的url,特别是带?的url 解决方案: 1 ...

随机推荐

  1. php-5.6.26源代码 - 如何用C语言支持“类似异常”机制

    代码编写在文件php-\Zend\zend.h #define zend_bailout() _zend_bailout(__FILE__, __LINE__) #ifdef HAVE_SIGSETJ ...

  2. http网络协议 学习摘要

    一:HTTP协议状态码 状态码主要用于描述当客户端向服务器发送请求时的返回结果,标记服务端的处理是否正常,通知出现的错误等工作. 状态码整体分为五大类: 1开头的状态码:信息类状态码,主要接收请求,表 ...

  3. SQL_server_2008_r2和visual studio 2010旗舰版的安装(2013-01-16-bd 写的日志迁移

    (以下操作是在Oracle VM virtualBox虚拟机中操作的,其实VMware Workstation 9虚拟机也挺不错的,不过用了很久的vmware想换个虚拟机用用 就暂时用Oracle V ...

  4. 利用python进行坐标提取以及筛选(文件操作的小应用)

    由于目前暂时还未学习到python关于数据处理的模块方面的知识,且刚好最近朋友发来一份坐标数据文件(txt格式),让我帮他对其进行筛选, 因此利用了最近刚学过的python文件处理操作以及以前所学的基 ...

  5. ajax 传递文件成功时 jQuery提示parsererror错误

    后台返回值类型 改为:PrintWriter out = response.getWriter();String jsonStr = "{\"success\":\&qu ...

  6. HDFS HA(High Availability)高可用性

    HDFS HA(High Availability)高可用性 参考文献: 官方文档 全文翻译 Hadoop组件之-HDFS(HA实现细节) 这张图片的个人理解 由于NameNode在Hadoop1只有 ...

  7. PHP.31-TP框架商城应用实例-后台7-商品会员修改-页面优化,多表数据更新

    商品表修改功能 1.页面优化,类似添加页面 <layout name="layout" /> <div class="tab-div"> ...

  8. Spring---bean的实例化

    Spring IoC容器如何实例化Bean呢?传统应用程序可以通过new和反射方式进行实例化Bean.而Spring IoC 容器则需要根据Bean定义里的配置元数据使用反射机制来创建Bean.在Sp ...

  9. Qsys配置生成nios系统模块

    1. 本次使用的是别人写好的例程,主要研究学习,使用quartus 11打开工程 2. bdf文件是块编辑器的,相当于原理图,以前只在用NIOS的时候会用到这种方式.接下来新建一个工程,添加原理图元件 ...

  10. 阿里云ECS Ubuntu安装PHP+Mysql+Apache+Nginx+Redis+Discuz

    http://www.linuxdiyf.com/linux/13662.html http://blog.csdn.net/wangnan537/article/details/47868659 h ...