关于js中的一些基础知识

2016-12-02  本文已影响0人  陆陆陆陆陆陆l

获取元素

document.getElementById(id);

obj.getElementsByTagName(tagName);

obj.getElementsByClassName(class);

getByClass

obj.getElementsByName(name);

变量

var name=value;

不能是数字

不能是系统保留名

不能是特殊符号

var _this=this;

var $this=this;

$();

show();

函数

function (){} 匿名函数

function show(){} 命名函数

找不到赋值对象默认都是window

流程控制语句

if(条件){

语句

}else{

语句

}

if(条件){

语句

}else if(条件){

语句

}

if(条件){

语句

}else if(条件){

语句

}else{

语句

}

if(){}

条件?语句1:语句2;

条件&&语句1;

if()

switch(值){

case :

语句

break;

case :

语句

break;

case :

语句

break;

default:

break;

}

循环

for(){} 性能较高

for in 性能较低

while(){}

初始化

条件

语句

自增

for(var i=0; i<5; i++){

alert(i);

}

选项卡

清空所有加上当前

非表单元素内容

innerHTML

document.write()和innerHTML区别

innerHTML操作非表单元素

write()操作页面(清空赋值)

检测数据类型

typeof

复合类型

object

基本类型

number string boolean undefined

function

显示类型转换/强制类型转换

parseInt  整数

parseFloat  浮点数

Number 数字 12abc  ×

NaN

属于数字类型

是个标志

和谁都不相等

判断非数字

isNaN()

隐式类型转换

- * / % -- ++ ==

运算符

+ - * / %

+= -+ /= *= %=

逻辑运算符

||  &&  !

比较运算符

< > == === <= >= != !==

什么是真和假

true 非空字符串 非零数字 非空对象

false 空字符串 数字0 null undefined

0==false  1==true

2==true -> false

作用域

全局 所有函数以外的变量

window.onload下的变量是局部变量

局部 函数内部的变量

闭包 子函数可以用父函数的变量

函数套一层

关于js

括号和分号什么时候加?

括号

定时器不能用括号

setInterval(fn,time);

事件函数

function fn(){}

oBtn.onclick=fn;

分号

赋值语句

var a=function (){};

执行语句

show();

随机数

Math.random();

获取计算过后样式

getStyle

返回值

掉用的时候只要结果需要返回值

只要过程不用返回值

eval

把字符串变成可执行语句

问题

注入式攻击

数组操作

push() pop() shift() unshift() splice() join() concat()

sort() reverse()

var arr=[1,2,3]; ->[3,1,2]

字符串操作

indexOf() lastIndexOf() substring() split() toUpperCase()

toLowerCase() charAt()

Math对象

Math.random()

Math.abs()

Math.max()

Math.min()

Math.pow()

Math.sqrt()

Math.ceil()

Math.floor()

Math.round()

Date对象

var oDate=new Date();

getFullYear();

getMonth()+1;

getDate();

getDay();

getHours();

getMinutes();

getSeconds();

getMilliseconds();

setFullYear(0,0-1,0);

setFullYear(0,0-1);

setFullYear(0);

setHours(0,0,0,0);

i的问题

封闭空间

自定义属性

封闭空间

i的问题

变量名冲突

匿名函数自执行

;()();

数组

var arr=[];

json

var json={};

DOM

obj.tagName

父级.children;

父级.childNodes;

obj.parentNode;

第一个

firstElementChild||firstChild

children[0]

最后一个

lastElementChild||lastChild

父级.children[父级.children.length-1]

获取上一个兄弟节点

previousElementSibling||previousSibling

获取下一个兄弟节点

nextElementSibling||nextSibling

创建

document.createElement('tagName');

插入

父级.appendChild(obj);

父级.insertBefore(obj,谁);

删除

父级.removeChild(obj);

innerHTML问题

未来元素加不上事件

获取位置

obj.offsetLeft/Top; 定位父级距离

obj.offsetWidth/Height; 盒子模型宽高

obj.offsetParent; 定位父级

绝对位置

getPost

getBoundingClientRect().left/top/right/bottom

事件

onclick

onmouseover

onmouseout

onmousedown

onmousemove

onmouseup

onmouseenter

onmouseleave

onmousewheel

DOMMouseScroll

oncontextmenu

ondblclick

onchange

oninput

onblur

onfocus

onkeydown

onkeyup

onload

onerror

onresize

onscroll

document.documentElement.scrollTop||document.body.scrollTop

document.documentElement.clientHeight/Width

内容高度

document.documentElement.scrollHeight/Width

事件对象

ev

var oEvent=ev||event;

事件流

obj.addEventListener('click',fn,false);

false 事件冒泡

true 事件捕获(事件下沉)

只存在高版本浏览器上

obj.attachEvent('onclick',fn);

解释一下IE事件流和chrome事件流

IE 只存在事件冒泡

chrome  可以是事件冒泡可以是捕获(true false)

解除事件绑定

removeEventListener()

用同一个函数

detachEvent();

事件源

oEvent.target||oEvent.srcElement

DOMReady();

window.onload所有资源加载完

html css img video audio flash..  js

DOMReady

html css js

cookie

在服务器环境下,跟随服务器发送

4K

默认会话结束(关闭浏览器)

name=value 成对出现

name不能重复

ajax交互服务器环境下wamp appservexmapp1.创建if(window.XMLHttpRequest){var oAjax=new XMLHttpRequest();}else{var oAjax=new ActiveXObject('Microsoft.XMLHTTP');}2.链接oAjax.open('GET',url,true);oAjax.open('POST',url,true);3.发送oAjax.send();oAjax.setRequestHeader('Content-Type','appliction/x-www-form-urlencoded');4.接收oAjax.onreadystatechange=function (){if(oAjax.readyState==4){if(oAjax.status==200){成功}else{失败}}};公司里ajax交互后台写好接口供你调用一起开发自己造假数据jsonpajax可以取本地数据但是不能跨域,那怎么才能让ajax跨域取数据请使用jsonp跨域解释下jsonp原理利用script src特性去其他服务器上拿js文件用其他的服务器上的脚本百度https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd=abc&cb=show搜狗https://www.sogou.com/suggnew/ajajjson?key=abc&type=web中搜http://tip.zhongsou.com/ctip?callback=show&w=abc------------------------------------------------------------jquery 库1.7.21.8.21.9.2选择器id class tagName * 嵌套 群组d(iv,p)伪类firstlastoddevenltgteqhascontains属性input[type=button]div[index=1]方法showhideanimateeqindexaddClassremoveClassfideInfideOutslideDownslideUpstop事件clicktoggle(fn,fn,.....)mouseovermouseouthover(fn,fn);jq中没有mousewheelDOM创建$('

abc

')插入appendTo 内部后面prependTo内部前面insertAfter 外部后台insertBefore外部前面删除$(obj).remove();$(obj).width()/height(); 纯宽高$(obj).innerWidth()/innerHeight()宽高+padding$(obj).outerWidth()/outerHeight()盒子模型宽高$(obj).offset().left/top; 绝对位置$(obj).position().left/top; 到定位父级$(window).width()/height() 可视区插件$.fn.xxx=function (){}$.fn.extend={xxx:function (){},xxx:function (){}};循环$(arr).each(function (index,element){});$.each('arr',function (index,element){});jq转原生$('div').get(0).style.background='red';原生转jqvar oDiv=document.getElementById('div1');$(oDiv).css({});事件绑定on 加绑定off 解除绑定function fn(){}$('input').on('click',fn);$('input').off('click',fn);事件委托$('ul').on('click','li',function (){});jq里面事件冒泡阻止默认事件return false;jq里面ev是兼容的ev.keyCode----------------------------------------正则正则表达式 规则表达式Regular Expression操作字符串更简单效率高性能高转义\\n\t 制表符\\b 元字符  占位符\w\d\s\W\D\S? {0,1}+ {1,}* {0,}选项img 忽略大小写,多行模式,全局比较重要的任选一个a[abc]caacabcacca[ab+]caacabca[(ab)+]caacabc排除[^a-z] [^0-9]范围[a-z][0-9][A-Z][14-79] 1,4,5,6,7,9匹配match数组测试test布尔值搜索search数字 索引值--------------------------------------分治冒泡快速归并选择二叉树散列 哈希

上一篇 下一篇

猜你喜欢

热点阅读