总结学习方法
- 不死记。而是靠熟练度增加记忆,实在忘记的查api,特别是css或者js方法
- 写代码的时候多想想,比如,用最简单的逻辑判断或者转换(像
a | 0, if(a.getAttribute) , a || b
等等),以及更多兼容写法。
3,不管多忙,每天积累一个 新 知识。拓宽新技术面。可以参考syy的总结。保证每天一篇
BOM
- close()== 点X
- 变量名不要使用关键字
/* var bl;就是 window.bl; */
不然会覆盖原来的,比如open,都是window的属性 -
widow.close()
//只能关掉自己 - window.open(url)
-
open_frame =window.open(url);
//url未定义,会打开空白页。所以打开前先判断url -
open_frame.document.write("asssdjd");
//因为开了一个页面,所以能取到document -
open_frame.close()
//关掉刚才打开的页面 - IE 下
open_frame.document
跨域不行,chrome都不允许。 - 同域下子能拿到父的东西吗?
window.opener.document, window.opener.btn_close.click()
//click()是dom对象内置的方法,包含onclick,addListener等,也适用于frame。
27ke 50min
- scrollTop
-
document.documentElement.scrollTop =2000
//ie
document.body.scrollTop = 2000
//chrome
两者的运行结果是兼容的都是2000.
也可以用兼容性写法 :
document.documentElement.scrollTop = document.body.scrollTop = 2000
var top ;top || 0 ; // top没有的话,用0运算 ; top | 0 ; //取整
-
鼠标滚动事件
- H5匹配css3动画
window.requestAnimationFrame
代替setTimeout
提高性能
动画时间不宜长。较长的话,会出一系列问题,比如动画期间会有其他操作影响动画质量
总结学习方法
1,不死记。而是靠熟练度增加记忆,实在忘记的查api,特别是css或者js方法
2,写代码的时候多想想,比如,用最简单的逻辑判断或者转换(像 a || 0, if
(a.getAttribute()) a || b等等),以及更多兼容写法。
3,不管多忙,每天积累一个 新 知识。拓宽新技术面。可以参考syy的总结。保证每天一
篇
close()== 点X
变量名不要使用关键字/*
var bl;就是
window.bl;
*/
不然会覆盖原来的,比如open,都是window的属性
widow.close()//只能关掉自己
open_frame =window.open(url);//url未定义,会打开空白页。所以打开前先判断url
open_frame.document.write("asssdjd");//因为开了一个页面,所以能取到document
open_frame.close()//关掉刚才打开的页面
IE 下open_frame.document跨域不行,chrome都不允许。
同域下
子能拿到父的东西吗?window.opener.document
window.opener.btn_close.click()//click()是dom对象内置的方法,包含onclick,以及
addListener等
也适用于frame
27ke 50min
document.documentElement.scrollTop =2000 //ie
document.body.scrollTop = 2000 //chrome
两者的运行结果是兼容的都是2000.
也可以用兼容性写法
document.documentElement.scrollTop = document.body.scrollTop = 2000
var top ;top || 0 ; // top没有的话,用0运算 top | 0 ; //取整
H5匹配css3动画 window.requestAnimationFrame 代替setTimeout提高性能
动画时间不宜长。较长的话,会出一系列问题,比如动画期间会有其他操作影响动画
navigator
参考样例:提示浏览器版本更新
github/shy2850/xhcms_2014/blob/master/js/modules/
iealert/index.js
Screen 参考w3地址
.width
.height//分辨率
History
.back()/.forword()/.go()
.state()
.pushState()//会把历史记录里当前页面替换掉
.replaceState(null,'','')
像这样整站同步页面,每个页面都是新刷的。但是用AngularJS做的网站是单页页面,
想做到地址栏变化,就得做好地址栏映射,不停的.state()。
做好AngularJS的数据映射,可以让异步网页同步。地址栏跟数据真正做到同步,看起来跟
同步网页一样。实际上是单页网页。但是只考虑支持的浏览器。不支持IE。目前在手机上
用的比较多。
AngularJS有着诸多特性,最为核心的是:MVVM、模块化、自动化双向数据绑定、语义化标
签、依赖注入、等
Location
.search//?... 参数。结束与#...
【github/shy2850/xhcms_2014/blob/master/js/modules/queryparam.js】
string.raplace(/name = val/,function(match,k,v){})
.hash//#... 索引某个id或name,就是锚点。[优先级是#后的再有有问号也叫hash.]
origin//域:协议+域名+端口,三者其一不一样就是跨域cross。顶级域名与二级域名也是
跨域,虽然可以补救(domain修改,前提是不用ajax),但是后遗症很多,比如发ajax请
求。
.pathname//目录 ,是href除去域origin、search、hash外的。一般由服务端来操作。
href = origin+pathname+serrch+hash
这些都是window对象【顶层对象,只有一个】的属性,都可以简写,略去window
XMLHttpRequest,文件传输类型,基于http请求的。
IE6是ActiveXObject,其他均内建XMLHttpRequest,
主代码
get:地址栏里显示所有的需要传递给后台的数据(search里),一个链接过去,都能看的
到。比如js,css,img等都是get请求过去的。
post:表单提交时或者如果有额外的数据,才用。
对服务器而言,参考f2e-server
request:浏览器发给服务端的数据
response:响应,服务端返给浏览器的数据,有type
responseText:取响应数据文本,然后JSON.parse()/JSON.stringify(),但是不兼容(IE8+
支持,IE7就没有内置JSON对象了)。
responseXML:取响应数据文本,若不是标准xml文档,返回null。
json: 格式本质是对象{}。Object是所有东西的基础对象。window、document都是自循环
对象:window.window.window....=window
标准的json对象格式的与js对象的差别【key,必须用引号,而且双引号。value,需是字面
量对象,显示对象,不能是复杂对象和正则对象。】
属性或者对象之间用逗号分隔,最后一个不能写逗号。】
校验网址
bjson.com
sojson.com
eval():把字符串当代码执行,同时用(),eval( '('+txt+')' );
IE7下,必须用window.JSON判断是否存在,而不能直接JSON。
IE6下没有console,只能alert.IE6没有XMLHttpRequest,是ActiveXObject
readyState的值:
get请求,2和3是同时的。
一般只对4做事情。13min
ajax,json与jsonp的差别
参考master/ajax.js,写框架模式的代码最锻炼算法。
jsonp,一般通过时间戳清除缓存。不像ajax-json可以设置cache
sc.on('load',function());//包括执行代码(回调函数)完毕
delete a;//删除全局callback变量
sc.remove();//把script标签也移除
jsonp回调函数的参数data就是后端文件里callback(data)里的data;
直接跨域:用文件系统访问就是。
math.random() * 1000 | 0//1000以内的随机数,0-999内的随机数
总之学习代码的时候,直接看样例。