JS

JS

BOM：浏览器对象模型

BOM核心对象window

回调函数

一个函数的参数是另一个函数

    <script>
        let callback = function(a){

        } 
        //箭头函数
        let callback1 = (fun) =>{
            fun(1);
        } 
        callback1(callback);
    </script>

 

计时函数

 //2000毫秒后打印21
        let timer = setTimeout(function(){
            console.log(21);
        },2000);
        //清楚计时函数
        clearTimeout(timer);

 

浏览器自带了以一个小型的数据库

浏览器自带了一个map集合，永久保存0.

//向Storage设置键值对
        window.localStorage.setItem("name","luck");
        //从Storage中根据键获取值
        localStorage.getItem("name");
        //从Storage中删除键值对
        localStorage.removeItem("name");
        //删除Storage中所有键值对
        localStorage.clear();

        //localStorage和sessionStorage
        /**
         * session:会话
         * 
        */

 

 弹窗

1.警告弹窗

alert();

2.带有确认和取消。点击确定返回true

confirm();

3.带有文本框的弹窗

prompt("请输入","例如：");

 

事件

onclick单击事件

ondblclick 双击事件

onblur 失去焦点，失去光标

onfocus 获得焦点

onchange 改变

onload 加载

let div = document.querySelector("div");
        /**
         * 参数一：要添加的事件类型
         * 参数二：添加的事件要触发的函数 
         */
        div.addEventListener("click",function(){
            alert("13");   
        });
        //方式二
        div.onclick = function(){
            alert("123");
        }
        //删除事件
        div.onclick = null;//false
        let callback = function(){
            alert("123");
        }
        div.addEventListener("click","callback");
        div.removeEventListener("click","callback");

        //表单提交事件 onsubmit="return fun()"
        //注意：加在form表单上
        //onsubmit要有return
        //函数要返回bolloean
        function fun(){
            return false;
        }

 

事件冒泡

//事件冒泡
        //要在子元素的事件触发函数里阻止
        event.stopPropagation();

 

模板字符串

  用 `   `  包含字符串

 

数据类型Symbl

let a = Symbl("hello");
let b = Symbl("hello");
//  a == b  返回false

 

Promise函数，处理回调地狱

 

JS库

开发中会引入很多库

JQuery.js

React.js

Angular.js

Vue.js

文档就绪函数

  当页面的文档部分加载完毕后，要执行的函数

//文档就绪函数
$(document).ready(function{
    alert("213");
});
//简写
$(function(){
    alert("124");
});

过滤器选择器：

:first---获取第一个元素

: last---获取最后一个元素

:eq(index)---给定位置的元素

:gt(index)---大于给定位置

:lt(index)---小于给定位置

:not(selector)---除了selector以外的所有选择器

内容选择器

：emtoy:匹配不包含子元素的选择器

：paernt:含有子元素的父元素