Jvavscript- 跟着李南江学编程

			弹窗

window.alert('你'); 
confirm('你');  
prompt('你'); 

	网页输出

document.write('你好');

	控制台输出

console.log('好');
console.warn('警告');
console.error('错误');

break;							立刻结束本次循环

continue;						跳过本次循环,进入下次循环

arr.splice()					数组增加数据
arr.push('d','b')				数组最后增加很多数据
arr.unshift('d','b')			数组前面增加很多数据
arr.pop()						删除数组最后一条数据
arr.shift()						删除数组前面一条数据

arr1.concat(arr2);						把aar1数组和arr2数组拼接在一起,不会改变之前的数组
let a = [...arr1 , ...arr2];			把aar1数组和arr2数组拼接在一起,不会改变之前的数组
let a = arr1.reverse();					把数组里面的123456改变成654321
let a = arr.indexOf(6666);  			查找6666的位置,如果找不到结果返回 -1
let a = arr.slice(1,3);					提取相应的数值,,提取23
let a = arr.includes(555);				查看数组里面有没有555这个数字

let str = prompt('请输入3个整数,用逗号隔开');
let arr = str.split(',');					切割

arguments					假的数组
    arr.forEach(function (currentValue,currentIndex,currentArray) {					
        // console.log(currentValue, currentIndex,currentArray);
        console.log(currentValue);
    })

prototype									函数里面的

console.log(a.constructor.name);			查看是什么类型				

console.log(obj1 instanceof Person);  	 	判断 obj1  是不是 Person 创建出来的			

isPrototypeOf											
	
console.log('name' in p);					判断p 里面有没有 name这个属性			
console.log(p.hasOwnProperty('agr'));									

for (let key in p){							把p里面的 属性  复制给 key			
        // console.log(key);	
        console.log(p[key]);
    }

let a = 'www.qq.com';
let c = a.startsWith("www")				判断是不是以www开头		
let a = 'www.qq.com';
let c = a.startsWith(com")				判断是不是以com结尾		
let  str = 'adc';
let a = str.replace('d','c');				adc 改变成 acc			
let a = document.querySelector('div');			
//console.log(a.children);				获取所有的子元素
console.log(a.childNodes);				获取所有的节点

let  a = document.querySelector('div');		获取第一个子节点					36
console.log(a.firstChild);

let  b = document.querySelector('div');		获取第一个子元素					36
console.log(b.firstElementChild);


let  c = document.querySelector('div');		获取最后一个子节点					36
console.log(c.lastChild);


let  d = document.querySelector('div');		获取最后一个子元素					36
console.log(d.lastElementChild);


let  e = document.querySelector('.item');		获取父元素或者父节点				36
console.log(e.parentElement);      			现在用这个
// console.log(e.parentNode);       		以前
let z = e.parentElement || e.parentNode;		兼容性写方
console.log(z);    

 let  e = document.querySelector('.item');
    console.log(e.previousSibling);                   		获取相邻的上一个节点
    console.log(e.previousElementSibling);             		获取相邻的上一个元素


   let  e = document.querySelector('.item');
    console.log(e.nextSibling);                              		获取相邻的下一个节点
    console.log(e.nextElementSibling);                 	    	获取相邻的下一个元素

	创建节点

let a = document.createElement('span');     		创建span 标签`					37
let dov = document.querySelector('div');     		拿到div
dov.appendChild(q);                         			把span标签  放进div里面

	插入节点
let span = document.createElement('span');    		创建span 标签					37
let dov = document.querySelector('div');     		拿到div
let ho = document.querySelector('h1');		拿到h1标签
dov.insertBefore(span,ho);                 			把span标签  放进div里面 并且放到h1前面

	删除节点
span.parentNode.removeChild(span);    		拿到span标签的父节点  删除span标签			37

    		复制
    let dov = document.querySelector('div');     		拿到div
    // let fz = dov.cloneNode();
    let fz = dov.cloneNode(true);
    console.log(fz);

   let img = document.querySelector('img');			获取元素属性				38
    // console.log(img.alt);
    console.log(img.getAttribute('alt'));           		可以获取自定义属性


     
    let a = document.querySelector('div');			获取元素内容
        console.log(a.innerHTML);
        console.log(a.innerText);
        console.log(a.textContent);

设置元素样式
        //第一种方式
let div = document.querySelector('div');								40
// div.className = 'box';
        //第二种方式
div.style.width = '300px';
div.style.height = '300px';
div.style.backgroundColor = 'blue';

 //获取样式
let div = document.querySelector('div');								40
// div.style.width = '300px';
// console.log(div.style.width);
let styl = window.getComputedStyle(div);
// console.log(styl);
console.log(styl.width);

	重复定时器									42
let a = document.querySelector('#start');
let id = null;
a.onclick =function () {
      id = setInterval(function () {
        console.log('你好');
    },1000);
}

let b = document.querySelector('#close');
b.onclick = function () {
    clearInterval(id);					删除定时器
}

	移入移出事件

			
    odiv.onmouseover = function () {				移入
        console.log('222222222');
    }
    odiv.onmouseenter = function () {				移入
       console.log('222222222');
    }


  odiv.onmouseout =function () {				移出
        console.log(63666);
    }
    odiv.onmouseleave =function () {				移出
            console.log(63666);
        }

    odiv.onmousemove = function () {				移动
        console.log(6666);
    }

获取焦点										51
// a.onfocus = function () {
//     console.log('hdudjfhce');
// }

	失去焦点
// a.οnblur= function () {
//     console.log('hdudjfhce');
// }


        		内容改变
// a.onchange = function () {
//     console.log(this.value)
// }

        		时时获取									51
a.oninput = function () {
    console.log(this.value);
}



 oBth.addEventListener('click',function () {							68
            alert('666');
        });



  oBth.attachEvent('onclick',function () {								68
                alert('888');
         });


event.preventDefault();				不然A标签跳转				69

oBth1.onclick = function () {									79
        console.log(window.location.href);
    }

            //重新设置地址
     oBth2.onclick = function () {
            window.location.href = 'http://www.qq.com';
        }


            //刷新
     oBth3.onclick = function () {
            window.location.reload();
        }

             //强制刷新
     oBth4.onclick = function () {								79
         window.location.reload(true);
        }

offsetWidth = 宽度 + 内边距 + 边框
offsetHeight = 高度 + 内边距 + 边框
clientWidth = 宽度 + 内边距
clientHeight = 高度 + 内边距
offsetLeft/offsetTop: 距离第一个定位祖先元素偏移位 || body
clientLeft/clientTop: 左边框 和 顶部边框

    scrollWidth: = 元素宽度 + 内边距宽度 == clientWidth
    scrollHeight: = 元素高度 + 内边距的高度 == clientHeight
    scrollWidth: = 元素宽度 + 内边距宽度 + 超出的宽度
    scrollHeight: = 元素高度 + 内边距的高度 + 超出的高度
    scrollTop: 超出元素内边距顶部的距离
    scrollLeft: 超出元素内边距左边的距离


    console.log(window.innerWidth);					获取网页宽高
    console.log(window.innerHeight);

我正在跟着江哥学编程, 更多前端+区块链课程: www.it666.com