您的位置:首页 > Web前端

无厘头知识--前端笔记

2016-03-15 21:44 267 查看
1. nextSibling、previousSibling

nextSibling 返回下一个节点(包括元素,本文)

previousSibling 返回上一个节点(包括元素,本文)

元素节点的nodeType值为1

属性节点的nodeType值为2

文本节点的nodeType值为3

2. 禁止鼠标右键

document.oncontextmenu = function(){
return false;
}


3. URI 转义加密(解密)

关键字符:它们用于分割URI中的各部,这些字符是:“;” “/” “?” “:” “@” “&” “=” “+” “$” “,” ,“#”(11个)

Mark字符:保留字符, 这些字符是:“-” “_” “.” “!” “~” “*” “’” “(” “)” (9个)

基本字符:大小写字母、数字(26+26+10=62个)

encodeURI (decodeURI):对于非上面三种(关键字符,Mark字符,基本字符)的进行转义转码,eg:空格==》”%20”。

var URI= "http://www.varme.cn?name=y s";
console.log(encodeURI(URI));             /* http://www.varme.cn?name=y%20s */


encodeURIComponent(decodeURIComponent):对于非上面三种(Mark字符,基本字符)的进行转义转码

var URI= "http://www.varme.cn?name=y s";
console.log(encodeURIComponent(URI));    /* http%3A%2F%2Fwww.varme.cn%3Fname%3Dy%20s */


4. 字符串转义加密(解密)

escape(unescape)不编码字符有69个:“*”,“+”,“-”,“.”,“/”,“@”,“_”,0-9,a-z,A-Z(71个)

var str = "name=y s&money=$12";
console.log(escape(str));                /* name%3Dy%20s%26money%3D%2412 */


5. 添加title图片

<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon" />


6. word-break 和 word-wrap 区别



作用如下:





7. contains() 和 compareDocumentPosition() 摘录自这里

①、DOMElement.contains(DOMNode)

用来确定 DOM Node 是否包含在另一个 DOM Element 中

var par = document.getElementById('parent');
var chi = document.getElementById('child');
alert(par.contains(chi));       //true


②、NodeA.compareDocumentPosition(NodeB)

确定 2 个 DOM Node 之间的相互位置, 使用这个方法你可以确定关于一个元素位置的一连串的信息。所有的这些信息将返回一个比特码(Bit,比特,亦称二进制位),如下表:

比特表示位掩码节点关系
0000000元素一致
0000011节点在不同的文档(或者一个在文档之外)
0000102节点 B 在节点 A 之前
0001004节点 A 在节点 B 之前
0010008节点 B 包含节点 A
01000016节点 A 包含节点 B
10000032浏览器的私有使用
var par = document.getElementById('parent');
var chi = document.getElementById('child');
alert(par.compareDocumentPosition(chi));    //20,之前4+包含16=20


8. git仓库上传文件命令

git init
git add README.md
git commit -m "first commit"
git remote add origin https://github.com/52UUD/studyNode.git git push -u origin master


9. 多余的部分用…表示

text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: