- 博客(24)
- 收藏
- 关注
原创 前端技能之Javascript
一。跨域问题解决方案:协议,域名,端口号三者之一不同即为跨域前端通信方式:Ajax,WebSocket,CORSxmlhttp.readyState有5种请求状态,从0-4发生变化0:请求未初始化1:服务器连接已经建立2:请求已经接受3:请求处理中4:请求已经完成,且响应已就绪xmlhttp.status,响应状态码:200-OK403-服务器拒绝请求404-服务器找不到...
2018-11-15 16:26:20
773
原创 前端开发技能之jQuery
一。区别attr()prop()is();attr()返回是属性值,prop(),is()返回的是布尔值;<input type="checkbox" checked="checked"/>,attr("checked")=>checked;prop("checked")=>true;is("checked")=>true;具有true
2018-11-14 23:00:22
328
原创 前端开发技能之CSS3
css3新特性:border-radius:6px(圆角); box-shadow:10px 10px 5px 1px #888;(水平阴影,垂直阴影,模糊距离,阴影尺寸,阴影颜色) text-shadow:10px 10px 10px #888;(水平阴影位置,垂直阴影位置,模糊距离,阴影颜色) rgba(0,0,0,0.6)背景色,比opacity:0.6,IE:filter:alp...
2018-11-14 11:27:31
328
原创 前端开发技能之HTML5
一.新添加元素和移除元素新增的结构元素:section元素:定义文档中的节 article元素:定义文档内的文章 aside元素:定义页面内容之外的内容 header元素 footer元素 nav元素:定义文档内导航链接 main元素:定义文档的主内容新增的其他元素:video元素,audio元素,canvas元素新增的input类型:email:必须输入email...
2018-11-13 16:19:04
361
原创 git 使用说明案例
远程和本地两个不同的分支要保持一致用git merge,举例说明:本地分支切换到dev分支,需要合并远程master分支上的代码(git merge origin master)远程和本地两个相同的分支,用git pull origin master 需求:从本地建一个dev分支,同时在远程建一个dev的分支。怎么做:本地只有一个分支master,新建一个本地分支...
2018-07-24 16:58:27
201
原创 js的原型及原型链(zeptojs核心设计思想循序渐进)
一。javascript原型链的基础知识javascript中万物皆为对象,对象分为普通对象和函数对象。1.每个函数都有一个prototype属性(每个函数包含自定义函数和系统内置函数)自定义函数这里打印出来的fn.prototype是一个对象,只包含一个constructor属性,指向该函数自身。系统内置函数:Array、ObjectArray
2018-01-24 15:28:50
247
原创 slice()和splice()区别
1.slice(start,end):方法可从已有数组中返回选定的元素,返回一个新数组,包含从start到end(不包含该元素)的数组元素。注意:该方法不会改变原数组,而是返回一个子数组,如果想删除数组中的一段元素,应该使用Array.splice()方法。start参数:必须,规定从何处开始选取,如果为负数,规定从数组尾部算起的位置,-1是指最后一个元素。end参数:可选(如果该参数没有指定,那
2018-01-19 16:52:19
111747
16
原创 前端性能优化
前端性能优化:一。页面级优化:1.减少HTTP请求次数:每个请求都是有成本的,包含时间成本和资源成本,一个完整的请求需要经过DNS寻址、与服务器建立链接,发送数据,等待服务器响应,接收数据这个复杂又漫长的过程。从设计层面简化页面合理设置HTTP缓存资源的合并和压缩css sprites减少不必要的HTTP跳转避免重复资源请求二。代码级优化:1.DOM操作:DOM操作
2018-01-12 16:23:16
211
原创 js跨域问题解决方案
参考:http://www.cnblogs.com/JChen666/p/3399951.htmljs跨域问题解决方案:1.document.domain+iframe(在主域相同的时候用这个方法)2.动态创建script(script标签不受同源策略的限制)3.location.hash+iframe(原理是利用location.hash来传值)4.window.name+i
2018-01-10 17:01:18
246
原创 js-6种继承方式
1.原型链继承2.构造继承3.实例继承4.拷贝继承5.组合继承6.寄生组合继承type="text/javascript"> function Animal(name) { this.name = name || 'Animal'; this.sleep = function(){ console.log(
2018-01-09 17:34:00
225
原创 js深拷贝和浅拷贝
js对象分为基本类型和复合(引用)类型,基本类型存放在栈内存,复合(引用)类型存放在堆内存。js的深浅拷贝只针对复杂数据类型(object,array)的复制问题,深浅拷贝都能实现在已有对象上复制一份的作用,但是对象的实例是存储在堆内存中然后通过一个引用值去操作对象,因此拷贝分两种情况,拷贝引用和拷贝实例,这是深浅拷贝的区别。。浅拷贝:拷贝引用,拷贝后的引用都是指向同一个对象的实例,彼此之
2018-01-08 17:06:34
382
原创 js事件委托原理
js事件委托原理:把事件委托到父元素上,利用冒泡原理,当子元素点击时,由于冒泡原理,事件会冒泡到父元素上,父元素上面的事件就会触发执行。1.子元素事件的效果相同id="ul"> 11111111 22222222 33333333 44444444type="text/javascript"> window.onload = function
2018-01-08 10:46:51
986
原创 js正则表达式-从后向前每3个数字加逗号(字符串)
String字符串对象方法:.split()方法把一个字符串分割成字符串数组.slice()截取字符串的片段,.slice(start,end),start包含,end不包含。var str = "Hello,my,name,is, ,China";console.log(str.split(",")); //["Hello", "my", "name", "is", " ",
2018-01-05 16:16:03
4635
原创 js正则表达式-4个数字之间相隔空格
\s:匹配任何空白字符,包括空格、制表符、换页符等等,等价于[\f\n\r\t\v]。\D:匹配非数字\d:匹配数字{}:一般表示匹配长度,举例子:\s{3}表示匹配三个空格,\s[1,3]表示匹配1-3个空格$1:配合()使用,选择第一个()trim():去掉字符串首尾空格type="text/javascript"> var str=' QW456026BR
2018-01-05 15:02:23
3337
原创 jQuery函数的attr()和prop()的区别
1.attr()和prop()操作对象不同attr即attribute,prop即property,两者都是属性却是两个不同的概念,attribute表示HTML文档的属性,property表示js的属性。举个栗子:这里的id、class、data_id都是该div元素的attribute-->id="attr" class="attr" data_id="122">type
2018-01-05 10:50:00
239
原创 移动端自适应之媒体查询,em,rem
1.响应式页面的实现(媒体查询和bootstrap的栅格布局)媒体查询针对不同的屏幕尺寸设置不同的样式html>lang="en"> charset="UTF-8"> name="viewport" content="width=device-width,height=device-height, user-scalable=no,initial-scale=1,
2018-01-03 10:43:27
1470
原创 CSS实现单行和多行文本溢出显示省略号……
1.单行文本溢出显示省略号…class="ellipsis"> 单行文本css溢出部分css溢出部分css溢出部分css溢出部分css溢出部分css溢出部分css溢出部分.ellipsis{//单行文本溢出 overflow: hidden; text-overflow:ellipsis;//文本溢出显示省略号 white-space:nowrap;//文本不会换行(单行文本
2018-01-02 15:53:39
40354
1
原创 nodejs的express框架,mockjs动态生成数据,javascript模版
html>lang="en"> charset="UTF-8"> Title 最新版本的 Bootstrap 核心 CSS 文件 --> rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFe
2017-12-29 16:18:40
1227
原创 Mock.js前端 一款可以脱离后台服务器,模仿接口的小东西
Mockjs实现了基于数据模版生成数据,拦截并模拟Ajax请求借鉴:https://segmentfault.com/a/1190000008839142https://github.com/nuysoft/Mock/wiki/Getting-Startednode的express框架app.jsvar express = require('express');v
2017-12-29 11:43:44
2290
原创 Vue.js双向数据绑定实现
js中对象属性类型有数据属性和访问器属性,这里实现简单的双向数据绑定是利用了对象的访问器属性中包含的get和set修改属性的默认特性使用Object.defineProperty()方法addEventListener(event,function,useCapture)绑定事件,实时检测,useCapture可选布尔值,默认为false,事件在冒泡阶段执行。事件触发过程中,DOM事件
2017-12-28 10:23:24
1153
原创 css如何清除浮动(clear和BFC)
清除浮动两种思路:1.利用clear属性清除浮动2.使父容器形成BFC(Block Formatting Contexts块级格式化上下文)利用clear属性清除浮动``swifthtml>lang="en"> charset="UTF-8"> 清除浮动 type="text/css"> .box{
2017-12-27 11:37:51
437
原创 ES6的箭头函数this和普通函数的this区别
普通函数中,内层函数不能从外层函数中继承this的值,在内层函数中,this会是window或者undefined,临时变量self用来将外部的this值导入到内部函数中(另外的方式是在内部函数执行.bind(this))ES6中的箭头函数会直接调用的this是继承父级的this。``swiftfunction fun(){ var self = this; s
2017-12-26 15:44:01
5760
原创 ajax的get和post请求区别
Get请求,最常用于向服务器查询某些信息Get请求或涉及到url传递参数时,被传递的参数要经过encodeURLComponent方法处理Post请求的频率相对于小于Get请求的频率,一般用于向服务器发送应该被保存的数据Get请求参数在URL中显示,大小限制在1024字节以下,请求的数据会被浏览器缓存,其他人可以从浏览器的历史记录中读取这些信息,相对于Post请求不安全。G
2017-12-26 14:55:43
392
原创 js鼠标拖拽事件
只记录left,top同理。clientX:返回鼠标相对于浏览器的水平坐标;offsetLeft:返回当前对象距离浏览器(父对象)的左侧距离;offsetWidth:对象的可见宽度;onmousemove:鼠标移动事件;连接点是鼠标放在div上拖动时的位置(坐标)不会改变的,起名字为unchangX;鼠标拖动事件是利用position:absolute绝对定位改变l
2017-12-22 10:59:10
3030
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人