关于web前端的MVC思想(二)——数据分开多次获取|jsonp

有可能会有这种情景,数据量很大,而且都是图片,那么如果一次性加载会导致页面浏览速度非常缓慢,对服务器也会造成流量方面的压力,或许那么多的数据对于用户来说并非都是被需要的,用户只需要其中的一部分。

那么这时候有种解决方案,就是一次只加载一部分数据,等到用户有更多的数据需求时再加载其它的部分,最后的效果的话类似网购搜索产品时,长长的产品清单拉到底部再另外加载一样。

下面用简单的js代码说明。

var _chunks=[];
var _chunkNum=0;

/* 回调函数 */
function cb(data) {
    // 存储数据
    _chunks[_chunkNum]=data;
    updateView()
}
/* 更新视图方法 */
function updateView(){
    if (需要加载更多的数据) {
        reqInBatch(num)
    }
}
/* 请求数据方法 */
function reqInBatch(chunkNum){
    _chunkNum=chunkNum;
    // ...发送请求
}
时间: 2024-12-20 18:08:16

关于web前端的MVC思想(二)——数据分开多次获取|jsonp的相关文章

web前端之MVC的JavaScript Web富应用开发一:MVC和类

web前端之MVC的JavaScript Web富应用开发一:MVC和类 开篇: 本书以 assert() 和 assertEqual() 函数来展示变量的值或者函数调用的结果. assert() 是一种快捷表述方式, 用来表示一个特定的变量( revolves to true). 这在自动化测试中是一种非常常见的模式. assert() 可以接收两个参数 : 一个值和一个可选的消息. 如果运行结果不是真值, 这个函数将抛出一个异常 : var assert = function(value,

php学习之bbs论坛项目-web架构和MVC思想

--显示和逻辑相分离-- 将功能强制地分成两个部分:1.负责显示的HTML部分 2.负责业务逻辑处理的PHP代码 HTML主要负责展示的部分,其中可变的数据是用动态脚本PHP来填充. 这样的混编文件一般叫作模板文件.因为用户不能直接请求模板文件,所以要通过apache分布式配置文件来隐藏它们. 在apache主配置文件中(httpd-vhosts.conf),配置权限时再多添加这样一行代码: Allowoverride all 接着,再在模板文件中创建.htaccess文件,写入如下代码即可.

web前端整套面试题(二)--今日头条面试题

12道单选,7道不定项选择,2道编程题 一.单选(12题) 1.[单选题]在HTML中,( )可以在网页上通过链接直接打开邮件客户端发送邮件. A.<a href=”telnet:[email protected]”>发送邮件</a> B.<a href=”mail:[email protected]”>发送邮件</a> C.<a href=”mailto:[email protected]”>发送邮件</a> D.<a hre

Web前端基础——jQuery(二)

一.jQuery 中的常用函数 1) $.map(Array,fn); 对数组中的每个元素,都用fn进行处理,fn将处理后的结果返回,最后得到一个数组 //因为这些操作,没有与dom元素相关的,所以可以不用写在 $(function(){...}); 中 var arr=[1,3,5,7,9]; arr=$.map(arr,function(item){ return item*10; }); alert(arr); [10,30,50,70,90]; //上例是将数组中的每个元素乘10,然后返

web前端【第十二篇】jQuery文档相关操作

一.相关知识点总结1.CSS .css() - .css("color") -> 获取color css值 - .css("color", "#ff0000") -> 设置值 - .css({"color": "#cccccc", "border": "1px solid #ff0000"}) -> 设置多个值 - .css(["color

【从0到1学Web前端】CSS定位问题二(float和display的使用)

display 属性规定元素应该生成的框的类型. 这个属性用于定义建立布局时元素生成的显示框类型.对于 HTML 等文档类型,如果使用 display 不谨慎会很危险,因为可能违反 HTML 中已经定义的显示层次结构.对于 XML,由于 XML 没有内置的这种层次结构,所有 display 是绝对必要的. 浏览器支持: 所有主流浏览器都支持 display 属性. 注释:任何版本的 Internet Explorer (包括 IE8)都不支持 "inherit"."inlin

WEB前端性能优化之二——css优化

1.把样式表置于顶部 现把样式表放到文档的< head />内部似乎会加快页面的下载速度.这是因为把样式表放到< head />内会使页面有步骤的加载显示.HTML规范清 楚指出样式表要放包含在页面的< head />区域内:“和< a />不同,< link />只能出现在文档的< head />区域内,尽管它可以多次使用它”.无论是引起白屏还是出现没有样式化的内容都不值得去尝试.最好的方案就是按照HTML规范在文 档< he

Web前端面试指导(十二):::before 和:before有什么区别?

题目点评 这个问题看来很简单,但如果之前没有琢磨这个问题,给人感觉也是门头一垂,听到这个题目就懵逼了,因为原来从来没有注意过这个问题,即便有注意这个问题也不能很好的回答清楚.回答的技巧就是从相同点和不同点,以及他们的作用,及注意事项上去回答. 解答要点  相同点 都可以用来表示伪类对象,用来设置对象前的内容 :befor和::before写法是等效的  不同点 :befor是Css2的写法,::before是Css3的写法 :before的兼容性要比::before好 ,不过在H5开发中建议使用

web前端基础知识-(二)CSS基本操作

1. 概述 css是英文Cascading Style Sheets的缩写,称为层叠样式表,用于对页面进行美化. 存在方式有三种:元素内联.页面嵌入和外部引入,比较三种方式的优缺点. 语法:style = 'key1:value1;key2:value2;' 行内式: 在标签中使用 style='xx:xxx;'单独加在某个标签上,style增加其他属性需要以分号分隔: 1 2 <div style="height: 100px;width:100px">我是div <