YinghaoGuo-CSDN博客

原创 ajax跨域，这应该是最全的解决方案了

本文来源：撒网要见鱼1. 前言从刚接触前端开发起，跨域这个词就一直以很高的频率在身边重复出现，一直到现在，已经调试过N个跨域相关的问题了，16年时也整理过一篇相关文章，但是感觉还是差了点什么，于是现在重新梳理了一下。个人见识有限，如有差错，请多多见谅，欢迎提出issue，另外看到这个标题，请勿喷~2. 题纲关于跨域，有N种类型，本文只专注于ajax请求跨域(,ajax跨域只是属...

2019-08-02 15:32:22 1609

原创关于前端的事情

使用input：clear不管用。ie9一下的input会出现默认叉叉，目前无法去除。

2019-01-14 17:08:21 306

转载完全理解float之“不完全脱离文档流”

0.前言float属性在css2中是一个热门的属性，被广泛应用于布局之中，同时由于不当使用float带来的问题也非常多，本文结合自己对float的理解以及实际项目中碰到float的相关问题，做一个详细总结，欢迎一起探讨，但未经同意禁止转载。以下是文章的目录float的特性float与absolute的区别float与inline-block清除浮动的方法

2017-09-18 09:10:56 8551 5

转载解决inline-block引起的空白间距问题

当我们在对元素的display属性使用inline-block值时，会在元素间形成一定宽度的空白间距。看一段代码： inline-block li{ display:inline-block; width:100px; height:100px; border-radius:1em; padding:10px; }

2017-09-18 00:12:09 1027

转载关于子元素的margin-top属性会传给父元素的问题

问题描述：一个父包含框包含一个子元素。给正常流的子元素一个垂直外边距margin-top就会使得父元素跟着往下走，而子元素和父元素的边距则没有发生变化。html结构：css样式：.box1{height:400px;background:#fad;}.box1_1{height:100px;margin-top:50px;background:#ade;}解决办

2017-09-18 00:02:31 1210 1

转载在浏览器中输入网址到网页展现全部过程

序最近接触到了整个网站的开发流程，所以就总结一下网站的运行机制，对网络应用如何工作有一个完整的层次化的认知。第一步过程首先，你得在浏览器里输入要网址:例如百度或者facebook。第二步过程浏览器查找域名的IP地址（域名就是指输入的网址）浏览器缓存 – 浏览器会缓存DNS记录一段时间。有趣的是，操作系统没

2017-08-18 16:23:14 935

原创 http与https

我们知道网络OSI模型的七个层次：其中TCP/IP和UDP协议属于传输层，而基于TCP协议的应用层协议有HTTP，HTTPS，FTP，SMTP，Telnet，POP3，Finge，NNTP，IMAP4等等；基于UDP的应用层协议有TFTP、SNMP与DNS等等。这里主要说一下HTTP和HTTPS协议的关联，其余的以后会补充。大多数人都知道的是HTTPS协议是HTTP协议的安全模式，

2017-08-18 16:19:53 411

原创加载css的link和@import的区别

网页加载css文件有两种方式：@import url("b.css");对比： link属于XHTML标签，而@import是CSS提供的;link标签除了可以加载CSS外，还可以做很多其它的事情，@import就只能加载CSS了。import只在IE5以上才能识别，而link是XHTML标签，无兼容问题;页面被加载的时，link会同时被加载，而@impor

2017-08-18 13:55:12 764

转载前端跨域解决办法（待整理）

方法大全： http://blog.csdn.net/joyhen/article/details/21631833特别注重H5的postMessage： http://www.cnblogs.com/dolphinX/p/3464056.html重点记住的有：domain+iframe , jsonp , poseMessage , webSocket 服务器端跨域

2017-08-18 10:01:33 307

原创 js中typeof与instanceof

1.typeoftypeof 返回值有六种可能： "number," "string," "boolean," "object," "function," 和 "undefined."我们可以使用typeof来获取一个变量是否存在，如if(typeof a!="undefined"){}，而不要去使用if(a)判断，因为如果a不存在（未声明）则会出错，typeof的运算数未定义,返回的就是

2017-08-15 16:55:10 274

原创 webpack中的loader（待学习）

https://segmentfault.com/a/1190000005742111http://www.cnblogs.com/eyunhua/p/6506278.htmlhttp://blog.csdn.net/keliyxyz/article/details/51579078http://blog.csdn.net/wp270280522/article/detai

2017-08-15 16:20:43 264

原创 Babel原理（待学习）

http://www.jianshu.com/p/e9b94b2d52e2

2017-08-15 16:05:41 302

转载 MySQL与MongoDB对比

MySQL与MongoDB对比：MongoDB的优势与劣势：MySQL与MongoDB应用场景：a.如果需要将mongodb作为后端db来代替mysql使用，即这里mysql与mongodb 属于平行级别，那么，这样的使用可能有以下几种情况的考量：(1)mongodb所负责部分以文档形式存储，能够有较好的代码亲和性，json格式的直接写入方便。(如日志之类)

2017-08-15 14:57:34 632

转载原生js为DOM添加方法

原生js为所有dom元素添加一个名为addEvent的方法，类似于jQ的$.fn.extend(addEvent:function(){......});if (window.HTMLElement) { // 使用原型扩展DOM自定义事件 HTMLElement.prototype.addEvent = function(type, fn, capture) {

2017-08-08 16:42:20 2840

原创 SQL中的内连接、左连接、右连接、全连接、交叉连接

sql连接查询可分为三大类：内连接、外连接、交叉连接。外连接又可分为左连接，右连接，全连接。我们最常用的应该是内连接，多表联合查询的时候使用的诸如“select * from a,b where a.uid=b.uid;”这就是一个典型内连接查询的例子，实际上这句与“select * form a inner join b on a.uid=b.uid”是等价的,后者逼格明显高了许多。下面来详

2017-08-04 10:08:39 715

转载 vue双向绑定

单向绑定非常简单，就是把Model绑定到View，当我们用JavaScript代码更新Model时，View就会自动更新。有单向绑定，就有双向绑定。如果用户更新了View，Model的数据也自动被更新了，这种情况就是双向绑定。什么情况下用户可以更新View呢？填写表单就是一个最直接的例子。当用户填写表单时，View的状态就被更新了，如果此时MVVM框架可以自动更新Model的状态，那就

2017-08-03 16:49:11 493

原创 gulp为项目文件添加版本号

先说一下本文讲的是什么。你一定看过这种带参的css或js文件，每次发布版本，专业一点的话，都会对新版文件打个tag，而我们为了和上一版本的文件做区分，就可以通过这种‘？+参数’ 的方式做版本标记。初学这东西也是百度了几个文档，照着文档来搞，MD百度上文档都一个熊样儿，大家互相抄袭，所以我没有成功，可能是我用的cnpm而是不npm，也可能是版本原因吧，最后通过简单查看了一下npm的包中的

2017-08-02 17:41:50 3686 2

原创前端构建工具gulp的使用基础

gulpjs是一个前端构建工具，与gruntjs相比，gulpjs无需写一大堆繁杂的配置参数，仅有四个API，都非常简单，学习起来很容易，而且gulpjs使用的是nodejs中stream来读取和操作数据，其速度更快。如果你还没有使用过前端构建工具，或者觉得gruntjs太难用的话，那就尝试一下gulp吧。1、gulp的安装

2017-08-01 13:55:10 430

原创网页调试实时刷新谷歌插件LiveReload

今天再给大家普及一款前端调试专用插件，谷歌的 liveReload,这东西是干嘛用的呢？我们知道编辑器，比如我用的webstorm，或者你们的submit，等等，在编写scss的时候能实时将文件夹中的.scss文件转换为.css文件，或者使用gulp时，能实时将js文件压缩呀等等，这些都是代码处理上编辑器或者前端框架对代码的实时操作，LiveReload插件能对浏览器进行实时刷新，也就是说每在

2017-08-01 10:25:41 7452

原创 js中this的绑定与丢失

一直以来，this指向的问题都困扰着我，老是不清楚this到底是指向调用对象还是指向window，今天做个了结。问题又下面这道题引出：var obj={ id:"awesome",cool:function coolFn(){ console.log(this.id); }};obj.cool()//awesomevar id="not awesome";setTimeout

2017-07-28 17:07:07 4148 1

原创表单中<select>的高级用法

下拉框： 1 2 3 4 5 6下面是对下拉框的基本操作：$(document).ready(function() { //绑定下拉框change事件，当下来框改变时调用 SelectChange()方法 $("#selectID").change(function() { SelectChange(); }

2017-07-27 18:07:37 2762

转载前端的BFC、IFC、GFC和FFC

什么是BFC、IFC、GFC和FFCCSS2.1中只有BFC和IFC, CSS3中才有GFC和FFC。FC的全称是：Formatting Contexts，是W3C CSS2.1规范中的一个概念。它是页面中的一块渲染区域，并且有一套渲染规则，它决定了其子元素将如何定位，以及和其他元素的关系和相互作用。1、BFCBFC(Block Formatting Context

2017-07-26 17:12:04 2960

一直都对Chrome情有独钟，第一次接触她只因她的icon就喜欢上她了，后来便一发不可自拔，现在几乎成为程序员最喜欢用的浏览器，至于优点很明显：强大的Developer Tools，响应快速，支持各种插件。当然也有些劣势，比如稍微占点内存，但是在如今这个硬件这么便宜的时代，这点几乎可以忽略，今天我就来给大家推荐下我自己常用的一些Chrome插件，你在别处可看不到，可以这么说，熟练使用这些插件，会对

2017-07-26 10:50:24 3823

转载前后端分离后的前端时代

1. 什么是前后端分离要区分前端和后端，需要有个明确的界限。一般，用户可以直接看到的东西，都是属于前端的范畴，除了前端之外都属于后端了。在传统的像ASP，JSP和PHP等开发模式中，前端是处在一个混沌的状态中，可以说是没有独立的“人格”可言。前端负责切图和编写静态页面模板，后端将数据渲染到前端提供的页面模板中，最后将页面渲染到浏览器展示。这个过程中，前

2017-07-26 10:23:59 430

原创 console输出的一些有价值的栗子

//*******************************************************************************1 for (var i = 0; i < 5; i++) { setTimeout(function() { console.log(i); }, 1000); } console.log(i);//5 5555,在setTimeout执行之前，for循环早就执行完了

2017-07-25 18:05:01 372

转载数据库大批量SQL插入性能优化

对于一些数据量较大的系统，数据库面临的问题除了查询效率低下，还有就是数据入库时间长。特别像报表系统，每天花费在数据导入上的时间可能会长达几个小时或十几个小时之久。因此，优化数据库插入性能是很有意义的。经过对MySQL InnoDB的一些性能测试，发现一些可以提高insert效率的方法，供大家参考参考。1、一条SQL语句插入多条数据常用的插入语句如：INSERT

2017-07-25 17:23:37 26960 2

原创使用Fiddler劫持网络资源

今天介绍一个本人认为超级实用的本地调试服务器端代码方法。在实际web开发中，经常面临的问题就是，明明本地调试正确，放到服务器上却出了bug，而使用浏览器F12进行的js调试刷新后才会生效，我们不可能改动一次js文件就上传到服务器一次重新看一次效果。如果你也时常有这个疑问，那继续往下看。需要用到的抓包工具是：Fiddler。fiddler 这个工具，在 web 开发中，用法非

2017-07-25 16:19:44 5296

原创 http请求状态码status和ajax请求状态值readystate

1开头的http状态码，表示临时响应并需要请求者继续执行操作的状态代码。100 （继续）请求者应当继续提出请求。服务器返回此代码表示已收到请求的第一部分，正在等待其余部分。 101 （切换协议）请求者已要求服务器切换协议，服务器已确认并准备切换。2开头的http状态码，表示请求成功200 成功处理了请求，一般情况下都是返回此状态码； 201

2017-07-25 14:38:23 6669

原创 JS的array.slice()和array.splice()的使用

JS中有两个操作数组的函数：slice(start,end)和splice(start,length,insert_one,insert_two......)，估计其意义大家都懂，简单说一下：array.slice(start,end)函数是取array数组中指定的一些元素：根据数组下标start和end，两个参数为取值的开始和结束下标，取出的值不包括end位置的值，生成一个新数组作为

2017-07-20 17:37:21 5564

原创 JS中URL参数的编解码

HTML中的$("form").serialize()函数，在submit按钮点击时，将form表单中含有name的input整理成一个“name=aaa&pass=bbb”这样的字符串，使用get方法请求时会将此后缀添加到请求url后面，如果请求内容中存在汉字（即form表单中需要传输的input中有汉字），汉字将转换为一种由“%”开头的编码，如下图：下图是将$("form").serial

2017-07-19 09:41:46 44784 1

原创网页中嵌套图片的输出格式说明

写前端网页的时候不乏涉及ps切图，如果能选择正确的切图格式，不但能保证图片的质量，还能减小图片尺寸、加快图片在网络上的传输，尤其是logo或者静态图较多的页面，切图尤为重要。一般来讲，前端切图输出的常用格式有三种：png8，png24，jpg(jpeg)，gif动图作为静态图片格式的时候，已经被压缩更好的 png8 代替（相同质量的图gif格式更大）， gif在动图中应用的更为广泛。1

2017-06-27 15:08:18 1016

原创 js数字的货币格式表示法(每三位一个逗号分隔)

要显示如下格式的数字，即数字的金钱表示法：小数部分保留两位小数，整数部分每隔三位使用一个“，”分隔代码如下： //保留两位小数并且整数部分三位一个逗号分隔符的数字金钱标准表示法： //这里假设我们即不知道输入数字的整数位数，也不知道小数位数 var dealNumber = function(str){ //为防止浮点型数字在扩大倍数过程中出现n个9的浮动，将

2017-06-27 13:26:15 16969 3

原创 call和apply用法（待修正）

call和applay用法

2017-06-27 11:08:46 278

原创 EDM（Email Direct Marketing）HTML制作要点

我们打开邮箱邮件，经常发现类似这样的网页：上图为京东发送的商用邮件，我们即称之为EDM，中文名电子邮箱营销。在网页中嵌入的京东推荐中，我们点击商品链接或者图片就可实现跳转等功能。我们可以思考一下，右侧为京东制作的营销网页，主站则为腾讯的QQ邮箱网站，QQ邮箱网页嵌入了京东的网页，那么腾讯会任京东的网页为所欲为么？肯定不会，例如，京东在网页中用fixed布局设置了一个跳转到京东主页的按钮

2017-06-16 16:54:07 6143

转载阿里、网易、滴滴共十次前端面试总结

HTMLHTML5新增了哪些内容或API，使用过哪些input和textarea的区别用一个div模拟textarea的实现 CSS左右布局：左边定宽、右边自适应，不少于3种方法CSS3用过哪些新特性BFC、IFC对栅格的理解（水平）居中有哪些实现方式1像素边框问题 JavaScript图片懒加载实现页面加载进度条事

2017-06-15 09:19:47 3467

原创 javascript立即执行函数表达式（IIFE）

IIFE：Immediately-Invoked Function Expression ——立即执行函数表达式。先说说javascript中什么是立即执行函数表达式，顾名思义，就是一个马上执行的函数，但这条执行的式子是一条表达式。正常情况下，我们定义一个function，再调用它，如下：function fun(){ ......}fun();如果不写fun()这一句，f

2017-06-14 16:58:32 1247

转载前端工程师的面试套路

具体来说，有那么一些原则：简历首先，错别字是肯定不能有的，不多解释。除此之外，字体、字号，以及边界对齐，都要做到整体一致，视觉上舒适。有个人博客、个人作品的，最好把链接加上，这样别人一点就能看而不用复制到浏览器。有些同学会把简历做成图片的格式，导致连复制链接都不能，这是典型的不为他人考虑。有些同学在mac上用pages做简历，完了就把.pages文件发过来，你怎能确定对方hr就是在用mac

2017-06-14 16:24:23 1623

原创 js中的同步和异步的个人理解

你应该知道，javascript语言是一门“单线程”的语言，不像java语言，类继承Thread再来个thread.start就可以开辟一个线程，所以，javascript就像一条流水线，仅仅是一条流水线而已，要么加工，要么包装，不能同时进行多个任务和流程。那么这里说的同步和异步到底是什么呢？其实个人觉得js官方的文档在使用两个词的时候并不准确，包括很多其他词汇，都只是听起来高深，但实际应用好

2017-06-09 15:09:05 106629 72

原创 jq中trigger和triggerHandler用法

我们经常要在js中手动触发一些事件，比如控制点击某个按钮，通过按钮的click事件执行一些操作等等。一般情况下我们使用js触发点击事件写法如下：$('#but').bind('click',function(){ $('#a_but').click(); //当点击#but时，触发#a_but的点击事件});使用trigger触发点击事件的写法如下：$('#but'

2017-06-09 11:13:09 4491

空空如也

空空如也