网址编码
一个网址有自己的网址,不同页面也有自己的id网址,我们常常会把网址送到后台,但是后台再处理有不认识的比如换行等特殊符号。所以我们要实现编码然后再传到后台:
- encodeURIComponment( )函数可以把字符串作为URI组件进行编码
- decodeURIComponment( )函数可以把字符串作为URI组件进行解码
操作字符串
- 合并字符串、连接数组: concat( )
- 取字符串: slice("取字符串的起始位置",[结束位置] ); [ ] 可选的
// 起始位置一定要有,结束位置可以省略
// 起始位置如果是负数,则是从右边往左边开始取
slice( 3,6):从第3个开始取到索引号为6的位置,但是不包括6
取字符串: substr(起始位置,[取得个数] ); [ ] 可选的
// 取得个数可以省略,指的是从起始位置开始往后面数几个
var txt = "abcdefghijk";
txt.substr(3,4): 结果为defg
兼容性的写法 :
- 取字符串: substring( )
用法同 substr 一样,区别是:substring 始终会把小的值作为起始位置,大的值作为结束位置。如 substring(6,3) 自动变成 substring(3,6);
保留小数位数
122340.12345 保留两位有效数字 122340.12
substr( 0, .+3)
通过 indexOf 返回小数点的位置
parseInt
先乘以100 取整,再除以100
toFixed(n) n:保留几位
例如:检查文件格式是否选择正确
缓动动画
移动速度越来越慢
offset家族
返回距离上级盒子(最近的带有定位)的位置
offset 自己的 (js中获取元素尺寸)
- offsetWidth、offsetHeight
得到对象的宽度和高度(自己的,与他人无关)
offsetWidth = width + border + padding
- offsetLeft、offsetTop
返回距离上级盒子(最近的带有定位)左边的位置
如果父级都没有定位则以 body为准
- offsetParent
返回该对象的父级(带有定位),不一定是亲爸爸,就近原则
区别:parentNode 返回父级,必须是亲的
事件对象 event
event 翻译过来就是 事件 的意思
再触发DOM上的某个事件时,会产生一个事件对象event,这个对象中包含着所有与事件相关的信息。所有浏览器都支持 event 对象,但支持的方式不同:
比如鼠标操作的时候,会添加鼠标位置的相关信息到事件对象中
普通浏览支持 event,ie678支持 window.event
采用兼容性写法:
event 常见属性:
pageX、clientX、screenX区别 (重点掌握)
pageX pageY:以我们的 文档 (绝对定位)的基准点对齐
clientX clientY:以我们的 可视区域 为基准点对齐
screen X screenY:以我们的 电脑屏幕 为基准点对齐
常用事件
onmousemove:当鼠标移动时,执行的事件
onmouseop:当鼠标弹起时,执行的事件
onmousedown:当鼠标按下时,执行的事件
1)拖动原理
当鼠标按下时,接着移动鼠标
// 当我们按下鼠标的时候,就要记录当前鼠标的位置
2)防止选择拖动
我们知道,按下鼠标然后拖动可以选择文字,清除选中的内容: