JavaScript
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
放在这里,加入js文件请求的很慢,那么页面就卡住一直等js文件加载完,才会继续向下加载。
最好放到body标签的最下面,先让页面加载完成,js慢慢加载,用户体验更好。
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> <script> $(function(){ var jsobject = document.getElementById("mydiv") alert(jsobject.title) jsobject.innerHTML = " <a href='www.baidu.com'>百度</a>" // jsobject.innerText=" <a href='www.baidu.com'>百度</a>" console.log(jsobject.name); var nav = $("#mydiv"); alert(nav) alert(nav.name) console.log(nav[0]); }) </script> <title>Document</title> </head> <body> <nav id="mydiv" title="test">导航栏</nav> <!-- <a href="www.baidu.com">百度</a> -->
***********这里放script代码,最好*********** </body> </html>
变量
定义时不需要指定类型,同python都是动态语言。
es5中的变量声明用var,设计漏洞,没有作用域。
es6引入let表示变量,const表示常量,有了作用域。
==比较value
===比较value和type
a=1 b="1" a==b true a===b false
数据类型
略
OOP
es5中的对象用的函数伪造 ,用的闭包,丑陋难用。
1.函数嵌套。2.内部函数用了外部函数的作用域。
了解即可,看es6。
function F(name,age){ this.name=name; this.age=age; this.f2=funciton(arg){ return this.name+this.arg; } }
var fff0=new F("zhansgan2",14)
var fff1=new F("zhansgan1",15)
var fff2=new F("zhansgan",13)
F本身是个对象,相当于一个容器,this.f2=function ...相当于为每个对象都开了空间存放函数片段。
为此又用了原型来优化,函数代码片段只用一份。
Foo.prototyoe
仅仅了解,直接上es6的OOP{}。
es6引入对象,OOP思想。
可以把对象视为容器:1、装相同的数据结构。2、数据和功能的结合体。视场景而定。
函数
普通函数
function f1(arg){ return true; }
匿名函数
const f2=function(arg){ return true; }
自执行函数----在后面的闭包,用于封装。
将函数定义与函数执行合并在一起,函数定义一个(),后面跟一个()执行函数。 (function(arg){ alert(arg); })(123)
作用域
es5中没有块级作用域,{}
es5前靠着函数的封闭j间接搞出了作用域,用的原理是函数内变量不能被外部访问
funciton f(){ var a=100 } alert(a) //报错,函数外无法访问函数内变量
但是es5中for if等代码块里面定义的变量全部是全局作用域。
js有个变量提前的概念,函数定义后,还没有执行,作用域就已经确定了
而变量提前指的是,编译时发现函数内定义了变量,就会提前将a=undefined,运行时执行到a=100赋值时,替换undefined
提前声明的目的是在代码运行前,将函数的作用域关系提前确定好。
如果 funciton f(){ alert(a) var a=100 } 输出undefined
但是
funciton f(){
alert(a)
}
就会报错,因为没有声明a,根本就没有声明,何来提前声明
es6中引入let后有了块级作用域。上面了解即可。
闭包
利用上面的作用域链
js有很多的插件可以下载,每个人开发的插件不一样,每个插件的全局变量很大的概率变量名是相同的,例如三个插件里面的全局变量都有叫a的
一旦你引入这些插件,立马按顺序覆盖了,还用个鸟。
此时es5只能借助函数的作用域了,然后自执行。
(function(){A公司开发的代码})()
(function(){B公司开发的代码})()
(function(){C公司开发的代码})()
dom操作了解即可
jquery直接跳过,上vue