码迷,mamicode.com
首页 > Web开发 > 详细

js基础整理总结

时间:2017-05-21 11:49:40      阅读:295      评论:0      收藏:0      [点我收藏+]

标签:执行   变量作用域   ase   body   号码   dev   lis   val   pps   

  • 变量和变量作用域

变量和函数声明提升定义

Var a=100;

Function test(){

这时候由于变量声明提升,a变量已经声明,值为undefined

Console.log(a);

Var a=10;

}

 

  • 字符串

数据类型检测方法:typeof()

函数用法

indexOf 获取索引值

charAt 根据索引值获取单个字符

concat连接字符串

subStr获取部分字符串

substring获取部分字符串

slice获取部分字符串

split(”,”)分割

join合并

字符串大小写转换

toLowerCase (小)

toUpperCase (大)

  • 数组

shift unshift  从数组开头开始添加或者删除

pop push   从数组末尾添加或者删除

concat:返回一个新数组,是将参数添加到原数组中构成的

排序 sort 从小到大 reverse 从大到小排序

slice(start,end) 数组截取

join(“|”) 数组拼接成字符串1|2|3|4|5

splice(start,deleteCount,val1,val2,...)

 从start位置开始删除deleteCount项,并从该位置起插入val1,val2,..

  • 数据类型
  • 日期

console.log(‘获取日期‘)

date = new Date();

console.log(date.getFullYear())  //获取完整的年份

console.log(date.getYear())      //获取当前年份

console.log(date.getMonth())     //获取当前月份

console.log(date.getDate());   //获取几号

console.log(date.getDay());    //获取星期几

console.log(‘获取时间‘)

date = new Date();

console.log(date.getHours())            //获取小时              

console.log(date.getMinutes());         //获取分               

console.log(date.getSeconds());         //获取秒               

console.log(date.getMilliseconds());  // 获取毫秒               

console.log(date.getTime());          // 获取相对于1970-01-01的毫秒值

//设置时间

date = new Date();

date.setFullYear(9999); // => 9999年

date.setMonth(11); // => 11:月;实际为12月份(月份从0开始计算)

date.setDate(25); // => 25:日

date.setHours(15); // => 15:时

date.setMinutes(30); // => 30:分

date.setSeconds(40); // => 40:秒

date.setMilliseconds(333); // => 333:毫秒

console.log(date); // =>  9999年12月25日 15点30分40秒 333毫秒

  • 循环语句
  • 数学对象

Math

round(x)      把数四舍五入为最接近的整数。

random()    返回 0 ~ 1 之间的随机数。

  • 事件

点击事件

Onclick

Click

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<button id="btn1">aa</button>
<button id="btn2">bb</button>
<button id="btn3" onclick="change()">cc</button>
<button id="btn4">ee</button>
<button id="btn5" onclick="change()">ff</button>
</body>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
    //点击事件  onclick是事件,而click是方法
    $(function () {

    //第一种方法addEventListener添加的事件  removeEventListener() 方法来移除
    var btn1=document.getElementById(‘btn1‘);

    var btn2=document.getElementById(‘btn2‘);
    btn1.addEventListener(‘click‘,change);
    btn2.addEventListener(‘click‘,function(){alert(this.id)},false);
  //第二种方法

        //click本身是方法作用是触发onclick事件,只要执行了元素的click()方法,就会触发onclick事件。
     $("#btn4").click(function(){

       $("#btn3").click();
      }) ;
//click方法中的function代码会在onclick事件执行完后执行,此时click方法起到追加事件的作用
        $("#btn5").click(function () {

            alert("click btn5");
        });
//        document.getElementById("btn3").onclick();
//        document.getElementById("btn3").click();
  });

    function change() {
        alert("onclick btn3");
    }
</script>
</html>

 

鼠标移上离开事件

Onmouseenter鼠标移上

Onmouseleave鼠标离开

dbclick事件:迅速连续的两次点击时触发

mousedown事件:按下鼠标时触发

mouseup事件:松开鼠标时触发

toggle事件:鼠标点击切换事件

hover事件鼠标指针悬停

mouseover事件:鼠标从一个元素移入另一个元素时触发

mouseout事件:鼠标移出元素时触发

焦点事件

focus() 获取焦点

blur() 失去焦点

<input type="text"><span>请输入你的电话号码?</span>

 

$("input").focus(function(){
    $("span").css("display","inline").fadeOut(2000);
});
//失去焦点
$("input").blur(function(){

    alert("输入框失去了焦点");
});

 常见题目

1.将一个变量放在外面和放在函数中的区别:

将一个变量放在外面,一般称之为全局变量:当前页面内有效

将一个变量放在一个函数中,一般称之为局部变量:只在函数内有效

2. ”==”和“===”的不同

==表示相等:只要值相等就可以了,数据类型不一定相等(会自动做类型转换)

1==‘1’(相等)

===表示全等于:比较的时候必须值和数据类型都相等才相等

1===‘1’(不相等)

3.函数

知道函数其实就是一个工具,我们只需要学会使用工具就可以实现某个功能

这就是封装性

4. split() join() 的区别

前者是切割成数组的形式,后者是将数组转换成字符串

5.题目

5.1写个函数将string的每个字符之间加个空格返回,例如:

addSpace(“hello world”) // -> ‘h e l l o  w o r l d’

5.2已知有字符串”get-element-by-id”,写一个function将其转化成驼峰表示法getElementById

5.3 写一个函数,实现如下功能:

字符串反转,如将 ‘12345678‘ 变成 ‘87654321‘

js基础整理总结

标签:执行   变量作用域   ase   body   号码   dev   lis   val   pps   

原文地址:http://www.cnblogs.com/eternalness/p/6884136.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!