第五周作业 2014-08-15 崔景宇
图片延时加载
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>图片延迟加载</title>
</head>
<body>
<div id="images"></div>
<script src="../jquery/jquery-1.11.0.min.js"></script>
<script>
// 构建图片列表
var html = []
for (var i=0; i< 10; i++) {
html.push('<p><img data-src="image/'+(i%5)+'.jpg?'+i+'" width="560" height="305"></p>')
}
$('div').html(html.join(''))
</script>
<script type="text/javascript">
(lazyload = function(window, jQuery) {
if (window.timedo) {
window.clearTimeout(window.timedo);
}
var $img = jQuery("img[data-src]");
if ($img.length <= 0) {
wlog("图片全部加载完成.");
return false;
}
window.timedo = window.setTimeout(function() {
var $windowTop = jQuery(window).scrollTop();
var length = $img.length;
$img.each(function(index) {
var $imgTop = $(this).offset().top - $(this).height()*1.9;
if ($imgTop <= $windowTop) {
$(this).attr("src", $(this).attr("data-src")).removeAttr("data-src");
length--;
}
});
wlog('当前还有',length,'张图片未加载!');
}, 300);
})(window, $);
$(window).bind("scroll", function() {
if (false === lazyload(window, $)) {
wlog("解除绑定.");
$(this).unbind("scroll");
}
});
function wlog() {
var queryStr = window.location.search;
if (queryStr.match("debug")) {
var info = [];
info = info.concat.apply(info, arguments);
if (!info) return;
console.info.apply(console, info);
}
}
</script>
</body>
</html>
{} == false false首先会被转成0; 然后{}会valueOf,但会转成Object {} 所以会toString便会等于[object Object] = NaN NaN和任何数字比较都是false 所以最后结果是false; 作用域的理解 : 当使用var 定义变量时,变量就会被封闭到它所在的空间. 当使用一个变量时,我理解为向上冒泡查找,所以demo2能找到demo里的变量而demo() 无法找到demo1里的变量. 图片：1.gif 
闭包的理解:demo2,demo3可以使用demo的变量,正常情况下,function demo在调用完成后内存会释放,但因为它内部存在一个闭包,所以内存不会被释放,内部的变量会被保留下来. function demo( ){
var a = 1;
var demo2 = function(){
console.info(a++);
}
return demo2;
}
var test = demo();
test();
test();
test();
//内存没有被释放, a最后会等于3;
原型和原型链: 我个人理解: 原型是一个对象初始化时所携带的属性和方法,本身就是一个对象(因为只有对象才具备属性和方法), 原型链是寻找这个对象属性和方法的线索. 正常情况下 数组,数字,字符串本身不是对象,所以他们本身不具备也不能设置属性和方法. 但是他们的原型Array,Number,String均是继承的Object,所以他们 "又" 是对象. 所以为他们的原型设置属性和方法,初始化后,他们便可以调用到这些属性和方法. 只有function才拥有prototype 因为数字,数组,字符串不是对象,不具备成为原型的条件. 又因为原型的设置 应在于 "初始化之前"; a = {} 实质上等于 a = new Object 我觉得prototype本身就是为面向对象设计的,所以理所当然的只有function才具备使用 prototype的条件, 而且必须在 "new function" 关键词之前使用; 因为"new"之后,这个function本身变为了一个对象,也便不再具备prototype. 毕竟 Obj.XXX就能设置属性和方法,也没必要使用prototype. 图片：2.gif 
以上就是我的理解,应用比较少,理解比较肤浅. |
|
|
喜欢0
|
