JavaScript是没有Print()方法的。
所以要做内容输出，需要用到console.log(xxx)控制台输出。
Chrome浏览器中就可以编写代码，或者在编译器中，写纯JavaScript代码，输出时用console.log
即可打印内容。
在js的世界中print() == console.log()
基础认知
字符串方法
var str = "html" + "css" //字符串拼接var str2 = "javascript"var str3 = "html&CSS&js"var str4 = " html aaaa "str.length //获取长度str.concat(str2) // 字符串拼接str.replace("c","x") //字符串替换,不影响原来数据。str3.split("&") //分割字符串，写入分割条件后，字符节以列表形式显示。str3.substr(1) //字符串中抽取从 start 下标开始的指定数目的字符str3.substr(0,4) //字符串截取,下标从0开始，从何处开始，截取几位？str3.substring(5,8) //字符串截取，从哪里开始，到哪里结束str3.toUpperCase()//全部转换为大写str3.toLowerCase()//全部转换为小写str3.charAt(3) //返回指定位置，只去1位str4.trim() //去掉前后空格
对数字的操作
//MAth 可结合运算符多种搭配console.log(Math.PI) //圆周率console.log(Math.ceil(1.5)) //向上取整console.log(Math.floor(1.6)) //向下取整console.log(Math.round(1.4)) //四舍五入console.log(Math.random()) //随机数0-1console.log(Math.random()*10) //随机数0-10console.log(Math.ceil(Math.random()*10)) //向上取整随机数0-10
数据类型与转换
//判断数据类型console.log(typeof "html") //返回字符串类型stringconsole.log(typeof 1) //返回数字类型numberconsole.log(typeof true) //返回布尔类型booleanconsole.log(typeof {}) //返回对象类型objectconsole.log(typeof function () {}) // 返回funcation//数据类型转换console.log(String(5)) //数字转换字符串console.log(String(10+10))console.log(Number("6")) //字符串转换数字console.log(Number("a")) //返回NaN ,因为它不是一个数字console.log(Number(false))//返回0console.log(Number(true))//返回1console.log(parseInt("1.6")) //取整，省略小数console.log(parseFloat("1.7")) //保留小数
数组的使用
var list = ['a',2,1,['a','b']] //数组就是python中的列表var list2 = ["cc","bb","aa"]list.length //显示长度console.log(list[3][0])list.length = 3 //改变成都会删除下标后的的内容。list.shift()//删除第一个list.pop() //删除最后一个list.join("&") //使用指定符号拼接成字符串list[0] //通过下标获取元素list.push() //在数组最前添加元素。list.unshift() //在数组最后添加元素list.sort() //从小到大排序list.concat(list2)//拼接2个数组list.slice(0,3)//提取列表中某部分，下标取值list.splice()//删除元素或替换。//数组快速循环方法list.forEach(function (item){console.log(item)})
对象
var obj={name:"张三",age:"26",height:"180cm",a:['a','b','c']}console.log(obj)//获取字典中的key，显示valueobj.nameobj.ageobj.a
条件判断
if(5>2){console.log(1)}else if (20>10){}else {console.log(2)}//switch判断switch (5) {case 1:console.log(1)break;case 2:console.log(2)break;default:console.log(3)}
循环
var arrlist = [{name:"张三",age:"25",like:"足球"},{name:"张三",age:"25",like:"足球"},{name:"张三",age:"25",like:"足球"},]for(k in arrlist){console.log(arrlist[k])}for(var i=0;i<10;i++){console.log(i)}var i=0;while (i<10){console.log(i);i++;}//forEach 循环方法arrlist.forEach(function (item){console.log(item)})
函数
function fn() {console.log("我是方法字节使用")}fn() //函数调用
方法
通过观察函数调用与方法调用的区别
var b = function () {console.log("我是B变量调用的函数")}b() //方法调用
方法与函数最大的区别是多了一个var声明。
初始化
//以时间举例var data = new Date()console.log(data,"|",data.toLocaleString(),"|",data.getFullYear(),"|",data.getMinutes(),"|",data.getMonth(),"|",data.getTime())data.toLocaleString() //返回一个使用默认语言环境和格式设置（options）的格式化字data.getFullYear() //当前年份data.getMinutes() //当前分钟data.getMonth() //当前月份data.getTime() //1970年1月1日0时0分0秒（UTC，即协调世界时）距离该日期对象所代表时间的毫秒数。
Dom操作
HTML分别在什么时候使用ID、class、name？
ID 不可重复,多个标签情况下，可直接获取目标，精准定位。生产环境一般不用于重复name一般用在传参的标签中。配合value使用。
class为CSS的获取的名称，多用于范围样式。
ID、name、class 他们均可被CSS，JavaScript引用,针对不用的使用场景，可以互相嵌套引用。
节点导航（获取）
为根，同级别为兄弟，上级别为父
var ipt = document.getElementById("kw") //定位节点ipt.parentNode //获取节点的父节点var span = ipt.parentNode //创建父节点span.childNodes //获取奔DOM全部节点span.firstChild //第一个span.lastChild //最后一个span.nextSibling //获取当前节点的下一个节点span.previousSibling //返回当前节点的前一个兄弟节点,没有则返回null.
改变元素
document.getElementsByTagName("body").innerHTML //获取body的整体document.getElementsByTagName("body").innerHTML="<h1>标题</h1>" //修改body内容
改变元素现有属性
document.getElementById("s-img").srcdocument.getElementById("s-img").src="https://xxxx/xxx.svg" //修改此ID src属性的值
添加自定义的属性值
document.getElementById("s-img").setAttribute("data-href","xxxxx")
改变样式
document.getElementById("s-img").style.background="blue" //+style后跟css样式即可。
创建HTML元素
var script = document.createElement("script") //创建一个名为"script"的标签变量script.src="//so.exeye.run/alert"; //为标签添加属性
添加HTML元素
document.getElementById("body").append(script) //获取父元素，在父元素内容插入一段标签。
移除HTML标签
document.getElementById("body").removeChild(script)
替换HTML标签
var ipt = document.createElement("input") //新建一个标签document.getElementById("body").replaceChild(ipt,script) //新标签，替换旧标签。
写入新的HTML
document.write("<h1>11111</h1>") //清空当前文档的内容，写入新的HTML
为元素添加一个事件
document.getElementById("input").onclick=function(){alert(1)}
事件名可修改。onclick //点击时触发onchange //域的内容改变时发生onmouseover //鼠标移动到某个元素之上onmousedown //鼠标被按下onmousemove //鼠标被移动
添加多个相同事件时，第二个事件会覆盖第一个事件。多事件使用请使用事件监听的方式。
事件监听与移除
addEventListener //添加事件removeEventListener //移除事件var btn = document.getElementById('btn') //获取元素btn.addEventListener("click", function () {//添加事件console.log(1)})btn.addEventListener("click", fn) //添加事件function fn() {console.log(2)}btn.removeEventListener("click", fn)
eveal
eval()他会将字符串当作代码来执行
eval(alert(1)) //执行后则会直接弹窗eval("var a = 'html';alert(a)") //eval函数，字符串内容单js执行
localStorage
localStorage.setItem("name","AAAAA") //前边是key，后边是value，会写入本地存储localStorage.getItem("name") //获取key即可拿到value
BOM操作
windows
window.open("") //新窗口打开网页window.close("")window.innerHeight //获取网页高度window.innerWidth //获取网页宽度window.onload=function() {//窗口渲染完成后执行}
innerHeight取内容的值，若改变控制台的大小，页面也会随着变化。location
location.href //获取当前URLlocation.href="" //实行页面调整，不打开新窗口location.hostname //获取当前域名location.pathname //获取当前路径location.reload() //刷新页面location.search //返回？号后的所有参数内容
history
history.back() //点击后退键history.forward() //前进键history.go() //前进后退，+-数字即可history.pushState("","","") //再不刷新页面的情况下，修改URL显示
history.pushState可做欺骗使用。但只能改当前域名下的路径。navigator
navigator.appVersion //浏览器信息，不会被携带发送到服务器navigator.userAgent //获取user-Agent信息，会被携带发送至服务器。navigator.platform //操作系统navigator.language //获取语言
URL组成
协议://域名/路径/?参数名=参数值&参数名=参数值#ID定位跳转
如何获取URL中的参数内容？
location.href"/search/all/?query=xsser&only=all"location.search //返回？号后的所有参数内容"?query=xsser&only=all"location.search.substr(1) //字符串抽取"query=xsser&only=all"location.search.substr(1).split("&") //字符串分割["query=xsser", "only=all"]location.search.substr(1).split("&")[0].split("=") //通过数组下标获取内容再次分割["query", "xsser"]location.search.substr(1).split("&")[0].split("=")[1]//使用下标获取内容"xsser"
其他
for (var i=0,j=0;i<4,j<7;i++,j++){console.log(i)}
其中i<4,j<7为条件判断，且以右侧的条件为准
故循环判断条件为 j 的值，j 在 ++ 的同时，i 也在 ++。
