- 博客(56)
- 收藏
- 关注
RSS订阅原创 浅谈异步与同步
首先我们要理解什么是同步和异步同步：就是顺序执行的代码，调用这段代码我能直接获取到结果的就是同步异步：就是稍后执行的代码，调用这段代码我可能没办法立即获取执行结果，需要通过别的操作才可以得到结果但是JavaScript是以单线程的方式运行的，也就是同一时间只能进行一件事，试想一下，假如javascript是多线程的，如果线程1要删除一个DOM元素，节点2要让DOM元素运动起来并且显示，那么浏览器怎...
2018-05-15 11:09:09
405
原创 http与https
http，即超文本传输协议，最初的目的是为了提供一种发布和接收HTML页面的方法。首先一个http请求包含请求行、请求头部、空行和请求数据一个http响应包含消息报头、空行、响应正文定义在http1.0的方法有get、post、head三种方法get：向特定资源发起请求post：向指定资源提交数据进行数据处理。数据包含在请求体内，post请求可能用于新的资源的创建和已有资源的修...
2018-04-04 11:16:07
350
原创 less的学习
less是一门CSS预处理语言，在less中，也拥有变量这个概念//在less中使用变量@color:pink;@color-hover:darken(@color,20%);a{ background-color: @color;}a:hover{ background-color: @color-hover;}/*-------华丽分割线——------*///在选择器中使
2018-03-11 22:39:35
260
原创 Cache Manifest离线缓存
manifest是一个后缀名.manifest的文件，在文件中定义那些需要缓存的文件，支持manifest的浏览器会将按照manifest的规则，像文件一样保存在本地，从而在没有网络连接的情况下，也能访问页面。首先，这个是基于一个appcache的缓存机制，当我们正确配置appcache后，我们如果再次访问该应用的时候，浏览器会首先检查manifest文件是否有变动，如果有变动就会把形影的改变更新下
2018-02-06 21:19:47
2023
原创 Vue.js的学习（组件部分1）
我们一般通过new Vue({})的方式得到一个Vue实例 当我们注册Vue组件的时候，使用的是Vue.component(tagName,options) 全局注册//JS部分 首先全局注册一个组件Vue.component("hello",{"template:<div>hello</div>"})//然后得到Vue的实例var hello=new Vue({ el:"#hel
2018-02-06 19:37:52
217
原创 Vue.js的学习（6）
表单输入绑定Vue.js提供了v-model来给<input>&<textarea>创建双向数据绑定v-model会先忽略所有表单元素的value&&checked&&selected的初始值，而总是将Vue实例中的data数据值作为数据来源，v-model的作用是监控表单输入内容，然后绑定到{{内容}}中去 <div id="app7"> <p>Multiline message
2018-01-31 16:23:39
245
原创 Vue.js的学习（5）
事件处理程序v-on 是Vue用来监听DOM事件的指令缩写是@<ul id="app4"> <button @click="couter()">click</button> <li>按钮点击了{{num}}次</li> <button @click="hello">Click me</button> </ul>//JS代码 var exam
2018-01-30 15:38:40
197
原创 Vue.js的学习（4）
列表渲染我们用v-for 来进行列表的渲染操作 语法主要是 item in items语法，{{内容为item.message}}，在数据中我们用一个items的数组来包含一个{}的数据。<div id="app"> <ul> <li v-for="item in items">{{item.message}}</li> </ul></div>//JS语法var
2018-01-29 14:19:31
217
原创 Vue.js的学习(3)
条件渲染v-if 所以必须将它添加到一个元素上<div id="app"> <p v-if="seen">yes</p></div>//JSvar app=new Vue({ el:"#app", data:{ seen:true }})在控制台输入app.seen=false;就可以将元素隐藏既然有v-if就必须有v-else，当v-if的值
2018-01-26 11:51:52
195
原创 Vue.js的学习（2）
计算属性与观察者模板内的表达式非常便利，但是设计他们的初衷是用来简化运算的。在模板内放入太多的逻辑会让代码难以维护 所以当我们要使用复杂逻辑的时候我们最好使用计算属性<div id="example"> <p>原始:{{message}}</p> <p>翻转后:{{reverseMessage}}</p></div>//JS代码var text=new Vue
2018-01-25 12:13:32
186
原创 Vue.js的学习（1）
Vue实例我们通过new的方式创建Vue的实例//创建实例var vue=new Vue();//给这个实例添加一点什么var data={value:2};var vue=new Vue({ data:data})当这些属性的值发生改变时，视图会产生响应，会更改匹配的值，前提是这些属性必须是在Vue中存在的，如果新增data中没有的内容，就无法被重新渲染，需要注意的是，当我们使
2018-01-24 15:29:18
213
原创 JQuery的学习(3)
JQuery的DOM操作append() 在每个匹配项的末尾插入参数项目，（是插入其中）;appendTo() 将选择到的元素插入到参数末尾，（插入其中）;before() 在匹配的元素前插入参数，（外部插入）；after() 在匹配的元素后插入参数，（外部插入）;clone() 创建一个元素的深拷贝复制；detach() 删除所有匹配的元素empty() 删除所有匹配元素的子节点h
2018-01-14 09:51:37
227
原创 Jquery的学习（2）
JQuery的CSS相关.height() 得到元素高度或者设置元素高度.innerHeight() 得到元素的高度，包括padding，但是不包括border.innerWidth() 得到元素的宽度，包括padding，但是不包括border.offset() 得到元素相对于文档中的坐标，用left和top表示，outerwidth()和outerHeight() 可以得到元素的宽高，
2018-01-10 19:23:53
207
原创 Jquery的学习
Jquery选择器Jquery的选择器 类似与CSS的选择器 <div>div1</div> <div>div2</div> <p>jack</p> <ul> <li>1</li> <li>2</li> <li id="third">3</li> <li>4</li> </ul> //Jque
2018-01-08 11:20:44
222
原创 AJAX的学习
HTTP头部信息每个HTTP请求和响应都会带有相应的头部信息， 其中有的对开发人员有用，有的也没什么用。XHR对象也提供了操作这两种头部（响应头部和请求头部）信息的方法Accept：浏览器能够处理的内容类型Accept-Charset：浏览能够显示的字符集Accept-Encoding：浏览器能够处理的压缩编码Accept-Language：浏览器当前的语言设置Conection：浏览器与
2017-12-27 17:07:01
232
原创 AJAX和Comet的学习
IE5是第一个引入XHR对象的浏览器。在IE5中，XHR对象是通过MSXML库中的一个ActiveX对象实现的。因此在IE中可能会遇到三种不同版本的XHR对象，即MSXML2.XMLHttp.6.0、MSXML2.XMLHttp.3.0 MSXML2.XMLHttp.2.0 ，要使用库中的XHR对象要创建XML文档一样编写一个函数。function createXHR(){ if(typeo
2017-12-27 10:17:15
202
原创 JSON的学习
JSON的语法可以表示以下三种类型的值简单值：与Javascript中相同的语法，可以在JSON中表示字符串、数值、布尔值和Null。对象：对象作为一种复杂性数据类型，表示的时一组无序的键值对儿。而每对键值的值可以时简单值也可以是复杂数据类型值（对象或数组）数组：数组是一种复杂类型值，表示一组有序的值的列表，可以通过数值索引来访问其中的值，值可以是任何类型的值简单值最简单的JSON数据形式就
2017-12-26 10:51:19
240
原创 表单脚本学习（选择框脚本）
选择框是通过<select><option> 来实现的，为了方便与这个控件交互，除了所有表单字段共有的属性和方法外，HTMLSelectElement提供了我们多种属性和方法add()：向空间中插入新<option> 元素 方法接收两个参数(newOption，relOption)，其位置在relOption之前multiple：布尔值，表示是否允许多项选择options：该空间中optio
2017-12-20 14:59:08
285
原创 表单脚本学习笔记（表单基础）
表单是由<form> 元素来表示的，而在Javascript中，表单对应的时HTMLFormElement类型的，继承自HTMLElement，保留了原有的属性，也有自己独特的属性和方法acceptCharset：服务器能够处理的字符集，等价域HTML的accept-charset特性action：接受请求中的URL；等价于HTML中的actionelements：表单中所有的控件集合。en
2017-12-20 13:33:35
235
原创 事件委托
我们有1000个节点要添加click事件，这个时候我们怎么办?对于事件处理程序过多问题的解决方案就是事件委托。事件委托利用了事件冒泡，只指定一个事件处理程序，就可以管理某一类型的所有事件。 <ul> <li>A</li> <li>B</li> <li>C</li> <li>D</li> </ul>//js代码var u
2017-12-19 17:04:32
202
原创 事件类型
DOM3级事件规定了下列几类事件UI事件：当用户与页面上的元素交互时触发焦点事件：当用户获得或失去焦点时触发鼠标事件：当用户通过鼠标在页面上执行操作时触发文本事件：当在文档中输入文本时触发键盘事件，当用户通过键盘在页面上执行操作时触发合成事件：当为IME输入字符时触发变动事件：当DOM结构发生变化时触发UI事件UI事件 指的是那些不一定与用户操作有关的事件。比如Javascript中
2017-12-19 15:50:19
252
原创 跨浏览器的事件处理程序
我们第一个要创建的方法是addHandler() 它的职责是视情况分别使用DOM0级方法、DOM2级方法或者IE方法来添加事件。这个方法属于一个名叫EventUtil的对象。addHandler() 方法接收三个参数：要操作的元素、事件名称、事件处理程序函数。addHandler() 对应的方法是removeHandler，他也接收相同的参数。这个方法的职责是移除之前添加的事件处理程序—-无论事件处
2017-12-18 22:33:23
251
原创 事件
时间就是文档和浏览器窗口中发生的一些特定交互瞬间。可以使用侦听器来预定事件，以便事件发生时执行相应的代码。当我们在网页中点击一个按钮，我们点击的是什么？一个按钮？不是的，我们点击的是一个按钮，也点击了按钮的容器元素。事件流描述的是从页面中接收事件的顺序。在IE中，事件流是事件冒泡，而在Netscape中事件流则是事件捕获。事件冒泡 即事件开始时由最具体的元素接收，然后逐级向上传播到不为具体的节点。<
2017-12-17 22:11:55
216
原创 元素大小
offset dimension元素的可见大小由高度和宽度决定，包括所有的内边距、滚动条和边框大小但是不包括外边框。通过下列几个元素可以取得元素的偏移量offsetHeight：元素在垂直方向上占用的空间大小，以像素计。包括元素高度、水平滚动条的高度、上边框高度和下边框高度。offsetWidth：元素在水平方向占用的空间大小，以像素计。包括元素的高度、垂直滚动条的的宽度、左边框和右边框的宽度
2017-12-17 13:32:13
499
原创 DOM学习笔记（3）
HTMLDocument的变化HTML5扩展了HTMLDocument，增加了新的功能，与DOM扩展类似，这些变化同样基于哪些已经得到很多浏览器完美支持的专有扩展。所以尽管这些扩展被写入标准的时间相对不长，但很多浏览器很早已经支持这些功能了。readyState属性Document的readyState属性有loading和complete 这两个值，使用它最恰当的方法就是通过它来实现一个指示文档
2017-12-17 08:55:14
339
原创 DOM笔记（2）
创建文本节点我们可以用createElement创建新的元素，那我们要如何创建Text类型的节点呢，DOM提供给了我们createTextNode() 方法方便我们创建文本节点。这个方法接收一个参数（要创建的文本）var text=document.createTextNode("hello,world");document.body.appendChild(text)//页面被写入hello,w
2017-12-15 22:33:41
204
原创 DOM学习笔记（1）
DOM（文档对象模型）是针对HTML和XML文档的一个API。DOM描绘了一个层次化的节点树，允许开发人员添加移除修改页面的一部分。节点层次DOM可以将任何HTML和XML文档描绘成一个由多层节点构成的结构。节点分为几种不同的类型，每种类型分别表示文档中不同的信息或标记。每个节点拥有各自的特点、数据和方法。节点之间的关系构成了层次，而所有页面标记则表现为一个以特定借点为根节点的树形结构。<html>
2017-12-14 16:59:43
245
原创 正则表达式相关
元字符“^”：这个会匹配行或者字符串的起始位置，有时还会匹配整个文档的起始位置。“$”：这个会匹配行或者字符串的结尾。“\b”：不会匹配两边的字符，他会识别是否为单词的边界。“\d”：匹配数字“\w”：匹配字母数字和下划线“\s”：匹配空格“.”：匹配除了换行以外的任何字符反义字符“\W”：匹配任意不是字母数字下划线的字符“\S”：匹配任意不是空白符的字符“\D”：匹配任何非数
2017-12-08 22:30:49
176
原创 客户端检测（1）
举例来说，IE5.0以前并不支持document.getElementById()这个DOM方法。尽管可以使用document.all属性来实现相同的目的，但是IE5.0以前并没有getElementById()，所以有下面这个例子function getElement(id){ if (document.getElementById){ return document.ge
2017-12-08 14:03:14
201
原创 BOM的学习（2）
间歇与超时调用我们知道，Javascript是单线程语言，但它允许通过设置超时值和间歇值来调度代码在特定的时刻执行。超时调用是在指定的时间后执行代码，而后者则是每隔指定时间就调用一次代码。 超时调用需要使用window对象的setTimeout()方法，这个方法接收两个参数：要执行的代码和以毫秒表示的时间。其中，第一个参数可以是一个包含javascript代码的字符串，也可以是一个函数。第二个参数
2017-12-07 16:06:39
235
原创 BOM的学习（1）
Browser Object Model（浏览器对象模型） 他的核心对象是window，他表示浏览器的一个实例。即是Javascript访问浏览器窗口的一个借口，又是ES中的Global对象。由于window对象同时扮演着ECMAscript中的Global对象的角色，因此所有在全局作用域中声明的变量、函数都会变成window对象的属性和方法。var age=26;function sayAge
2017-12-06 22:33:17
238
原创 函数表达式（2）
闭包中的this对象我们知道this对象是运行时基于函数的执行环境绑定的，在全局环境中，this就等于window，而当函数作为某个对象的方法调用时，this等于这个对象。不过，当我们在闭包中使用this就会导致一些问题，因为匿名函数的执行环境具有全局性，因此this对象通常指向window。但是有时候由于编写闭包的方式不同，这一点也就不明显//匿名函数的全局性var name="The wind
2017-12-05 14:33:15
202
原创 函数表达式（1）(含闭包)
定义函数的方法有两种，一种是函数声明，一种是函数表达式//函数声明function app(){ console.log("app")；/app}//函数表达式var app=function(){ console.log("app");//app}他们两个不同的地方在于，函数声明会有一个提升（相当于会在执行代码前读取函数声明），而函数表达式不会有//函数声明 ap
2017-12-04 15:31:19
232
原创 继承（1）
ECMAscript中继承只支持实现继承，主要是依靠原型链继承来实现的，其基本思想是利用原型让一个引用类型继承另一个引用类型的属性和方法。每个构造函数都有一个原型对象，原型对象都包含一个指向构造函数的指针，而实例呢都包含一个指向原型的内部指针。 ECMAscript中的继承就是让一个原型对象等于另一个类型的实例，此时原型对象将包含一个指向另一个原型的指针，相应的，另一个原型也包含一个指向另一个构造函
2017-12-03 11:19:09
245
原创 面向对象的程序设计（3）
原型语法 function Person(){ } Person.prototype={ name:"burning", age:24, job:"captain", sayJob:function(){ console.log(this.job); } } v
2017-11-29 17:39:08
212
原创 面向对象的程序设计（2）
工厂模式javascript中没有类这个概念，程序猿就发明了一种函数，用函数来封装以特定接口创建对象的细节 function createProperty(name,age,job){ var o=new Object(); o.name=name; o.age=age; o.job=job; o.sayAll=f
2017-11-29 11:32:23
218
原创 面向对象的程序设计(1)
面向对象的语言标志，就是他有一个类的概念，通过类可以创建多个具有相同属性的方法和对象。但是ECMAscript并没有类的概念，所以它的对象也与其他语言中的对象有所不同ECMA把对象定义为：“无序属性的集合，其属性可以包含基本值、对象或者函数” 它基于引用类型，由引用类型创建出来。创建对象可以通过new一个Object的实例出来，然后给他添加属性和方法 var obj=new Object()
2017-11-28 13:15:18
256
原创 Function属性和方法与基本包装类型(3)
函数的属性与方法函数也是对象，对象也有属性和方法。每个函数都有length和prototype，length是函数参数的个数，而prototype是保存他们所有实例方法的真正所在，toString()和valueOf()都保存在它的名下 m2 每个函数都包含两个非继承而来的方法apply()和call()，这两个方法的用途都是在特定的作用域中调用函数。//apply的运用function su
2017-11-24 22:23:00
270
原创 Function类型(2)
函数作为值的函数function calculate(func,arg1,arg2){ return func(arg1,arg2); } function add(num1,num2){ return num1+num2; } var result=calculate(add,44,56); alert(result);/1
2017-11-23 13:41:16
328
原创 Function类型(1)
函数我们有三种方式定义一个函数函数表达式函数声明构造函数函数通常是使用函数声明来定义的，定义如下function add(a,b){ console.log(a+b); } add(2,5);//7接着是函数表达式var sum=function(a,b){ return a+b;} alert(sum(2,4));//6Function构造
2017-11-22 17:15:42
322
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人