qq_29854831-CSDN博客

原创 jQuery getScript() 方法

getScript() 方法使用 AJAX 的 HTTP GET 请求获取和执行 JavaScript。$.getScript("demo_ajax_script.js/url"，success(response,status))rul:必填success(response,status):可选。规定当请求成功时运行的函数。额外的参数：response - 包含来自请求的结果数据...

2018-11-23 11:44:18 768

1.三次握手的维基百科解释：To establish a connection, TCP uses a three-way handshake. Before a client attempts to connect with a server, the server must first bind to and listen at a port to open it up for conn...

2018-11-23 00:34:28 336

转载 getBoundingClientRect().top与offsetTop有什么区别？

Element.getBoundingClientRect()Element.offsetTop差别大了，前者指元素（比如某个div）距离可视区域顶部的距离，后者包括滚动条卷起的部分。js原生的offsetTop属性有很多浏览器兼容性问题，用时要慎重。...

2018-10-17 20:11:29 7188

原创 hashchange

window.addEventListener('hashchange', function(e) { console.log(e.oldURL); console.log(e.newURL);}, false);

2018-09-27 12:57:03 426

原创 setTimeout&& clearTimeout

<html> <head> <script type="text/javascript"> let c=0 let ttimedCount=()=> { document.getElementById('txt').value=c c=c+1 t=setTimeout(timedCount(),1000) } ...

2018-09-20 20:32:56 656

转载借助wbr标签实现连续英文字符的精准换行

转发自：https://www.zhangxinxu.com/wordpress/2018/09/html-wbr-word-break/1.一般情况下的换行：word-break:break-all或者word-wrap:break-word2.<wbr>标签换行方式<div style="width:150px; background:#cd0000;"&g...

2018-09-10 10:44:50 264

原创 js 实现copy

一. 简单用法： // 复制URL到粘贴板 handleCopy = url => { const textArea = document.createElement('textarea') textArea.style.width = '0' textArea.style.height = '0' text...

2018-08-22 11:42:57 848

原创动态加载script标签

/** * HTML动态加载js * @path {String} src地址必须带有后缀名.js * @callback {Function} 加载成功的回掉函数 * */var cache=[];function addJs(path,callback){ var flag=0;//检查是否加载的状态 for(var i=cache.length;i--;)...

2018-07-31 16:38:51 1521

原创聊聊新窗口打开页面的opener问题

1.新窗口中打开页面的方式：//a 链接<a target="_blank" />//openerwindow.open()2.新窗口中打开页面会有两方面的问题：安全问题，性能问题； 2.1安全问题：上面新窗口中打开页面的方式都会在新窗口中找到一个opener的对象。那什么是opener（MDN:）,简单来说，它是父窗口的窗口对象。如果新窗口和服窗...

2018-07-19 19:58:58 1010

转载 js 多线程的方式：web work

1.web workW3S:https://www.w3schools.com/htmL/html5_webworkers.aspWebWork 是运行在后台的 JavaScript，独立于其他脚本，不会影响页面的性能。您可以继续做任何愿意做的事情：点击、选取内容等等，而此时 web worker 在后台运行。注意：dom是不能被异步操作的! WebWork不能在本地使用 we...

2018-07-17 19:16:57 2516

转载文件上传接受的类型：file的accept属性

<input id="fileId1" type="file" accept="image/png,image/gif" name="file" />后缀名 MIME名称*.3gpp audio/3gpp, video/3gpp*.ac3 audio/ac3*.asf allpication/vnd.ms-asf*.au ...

2018-07-17 00:00:48 33546

原创 window 窗口间的信息传递和获取

思路：1.h5的postMessage2. localstorage3.window.opener https://developer.mozilla.org/zh-CN/docs/Web/API/Window/opener4.window.onstoragehttps://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/o...

2018-07-11 19:37:32 369

转载 scrollToAnchor 和 scrollintoviewifneeded

// 锚点 scrollToAnchor = (anchorName) => { if (anchorName) { // 找到锚点 let anchorElement = document.getElementById(anchorName); // 如果对应id的锚点存在，就跳转到锚点 if (anchorElem...

2018-06-25 20:19:57 1971

转载转载： jsonp 跨域前端 javascript

本文转载自：https://segmentfault.com/a/1190000009624849?utm_source=75teamweekly&utm_medium=referral本文按照政治问答题必备套路分为以下3个部分：为什么要跨域？跨域是什么？如何实现跨域？Section1、为什么要跨域？自古以来（1995年起），为了用户的信息安全，浏览器就引入了同源策略。那么同源策略是如何保...

2018-05-12 11:56:06 142

原创 js ===（全等号）的理解以及与lodash.isEqual的区别

先举个例子： let a=1; let b=1; a==b;//这里返回true;a===b;//这里返回true；然后 let a=[1,2]; let b=[1,2];a==b;//这里返回false；a===b;//这里返回true;isEqual(a,b);//这里返回true；//这里需要总结一下todo 接下来再看；let c=a;let d=a;c===d;//返回tru...

2018-04-26 20:38:49 4679 2

原创 npm yarn 简单比较

npm: 问题：根据package.json安装对应的版本包，但是由于一些语义版本控制而导致的npm安装的不确定性问题！！！安装依赖：npm 采用了扁平依赖关系树来管理对应的包依赖关系；这就是npm安装比较慢的原因。node_modules- package-A-- node_modules--- package-B----- node_modules------ package-C...

2018-04-18 19:42:22 1909

原创 nrm : npm私服

nvm全称Node Version Manager是 Nodejs 版本管理器，它让我们能方便的对 Nodejs 的版本进行切换。安装：$ npm install -g nrmnrm 常用命令：nvm install ## 安装指定版本，可模糊安装，如：安装v6.2.0，既可nvm install v6.2.0，又可nvm install 6.2nvm uninstall ## 删除已安装...

2018-04-18 18:46:13 350

原创 get和post请求的区别

对于get和post请求的简单的理解，可以从下面的几点来区别：区分点GETPOSTGET和POST长度的限制问题1.GET是通过URL提交数据，因此GET可提交的数据量就跟URL所能达到的最大长度有直接关系。 2.实际上HTTP协议对URL长度是没有限制的；限制URL长度大多数是浏览器或者服务器的配置参数。3.一般Parameter Type是query1.同样的，HTTP协议没有对POST进行任...

2018-03-22 22:39:11 233

转载 js中this的指向

本文转载自：http://www.cnblogs.com/pssp/p/5216085.html首先必须要说的是，this的指向在函数定义的时候是确定不了的，只有函数执行的时候才能确定this到底指向谁，实际上this的最终指向的是那个调用它的对象（这句话有些问题，后面会解释为什么会有问题，虽然网上大部分的文章都是这样说的，虽然在很多情况下那样去理解不会出什么问题，但是实际上那样理解是不准确的，所...

2018-03-22 22:02:19 129

原创 React.Component与React.PureComponent的区别

参考：https://react.bootcss.com/react/docs/react-api.html React.PureComponent 与 React.Component 几乎完全相同，但 React.PureComponent 通过prop和state的浅对比来实现 shouldComponentUpate()。如果React组件的 render() 函数在给定相同的pr...

2018-03-22 18:07:41 11694 2

原创 css:伪类与伪元素的区别

区别：简而言之，伪类是针对当前元素的状态，伪元素是针对当前元素的特定内容进行操作：伪类选择元素基于的是当前元素处于的状态，或者说元素当前所具有的特性，而不是元素的id、class、属性等静态的标志。由于状态是动态变化的，所以一个元素达到一个特定状态时，它可能得到一个伪类的样式；当状态改变时，它又会失去这个样式。由此可以看出，它的功能和class有些类似，但它是基于文档之外的抽象，所以叫伪类。与伪类...

2018-03-22 00:12:33 154

原创 browserHistory和hashHistory的差别，以及history

原文链接：点击打开链接一：对比这两个方式：无论是react，dva,还是antd pro，前端路由使用的是react router，所有可以选择两种方式：browserHistory和hashHistory。两者的区别简单来说是对路由方式的处理不一样，hashHistory 是以 # 后面的路径进行处理，通过 HTML 5 History 进行前端路由管理，而 browserHistory...

2018-03-21 11:02:39 13031 1

原创 css布局-position

这里主要是positon的4个属性。1.staticstatic 是默认值。任意 position: static; 的元素不会被特殊的定位。一个 static 元素表示它不会被“positioned”，一个 position 属性被设置为其他值的元素表示它会被“positioned”。2.relative在一个相对定位（position属性的值为relative）的元素上设置 top 、 rig...

2018-03-21 00:14:56 99

原创 h5 audio在react中的播放问题

问题代码片段： <audio controls controlsList="nodownload" > <source src={this.state.voiceURL} type="audio/ogg" /> <...

2018-03-14 15:50:07 11078 1

原创 react中的受控组件，非受控组件；

刚开始react的时候就接触到受控组件和非受控组件这个概念，然后那个时候长用的组件，比如input,select都是属于受控组件。受控组件：<input type="text" value={this.state.value} onChange={(e) => { this.setState({ value: e.targ...

2018-03-09 15:42:11 1487

原创 trim

trim函数的应用：去除字符串头尾空格的。在 JS 里一般情况下用正则去除字符串头尾空格的 trim 函数的写法为： String.prototype.trim = function () { return this.replace(/^[\s\t ]+|[\s\t ]+$/g, ''); } s = ' this is a trim function test. '; al...

2018-03-07 16:53:03 301

原创浏览器兼容问题

1.我经历过的项目都是react项目，目前遇到的浏览器兼容问题可以分为两类：（1）css的问题；（2）babel-polyfill的问题；针对第一中问题，我们一般可以直接查询，这里转一个链接，有比较多的css以及其他不同浏览器兼容问题的描述和解决方式：点击打开链接；第二种问题出现的原因是由于 Babel 默认只转换转各种 ES2015 语法，而不转换新的 API，比如 Promise，以及 Obj...

2018-03-07 16:00:23 293

转载数字签名是什么？

1.数字签名解释原文链接http://www.youdzone.com/signature.html2.阮一峰翻译链接：http://www.ruanyifeng.com/blog/2011/08/what_is_a_digital_signature.html

2018-03-07 15:15:52 134

转载 js 处理url的符号问题

1.原理讲解参考阮大神：点击打开链接2.拿来就用参考：http://fwheel.iteye.com/blog/2102957 && http://fwheel.iteye.com/blog/21029573.目前我在我的项目中使用的是encodeURI来吧路径进行转化。...

2018-03-07 11:46:21 626

原创 react中通过proxy解决跨域问题

一，对于使用creat-react-app构建的项目，可以直接在package.json下配置，具体如下"proxy": "http://api.xxxx.com"或者如果创建多个域，该如何设置proxy,能满足可以调用不同域下的API的需求？代码如下//package.json中加入 "proxy": { "/api/RoomApi": { "target": "http.

2018-03-06 11:46:59 32182 10

原创 web开发中的跨域问题解决方法

1.跨域问题出现的原因：同源策略/SOP（Same origin policy）是一种约定，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，浏览器很容易受到XSS、CSFR等攻击。SOP要求两个通讯地址的协议、域名、端口号必须相同，否则两个地址的通讯将被浏览器视为不安全的，并被block下来。比如“http页面”和“https页面”属于不同协议；“qq.com”、“www.qq.com”、...

2018-03-06 10:58:18 487

原创 // js浏览器兼容问题

//1.兼容点击事件function addEvent(dom,type,fn){ //对于支持DOM2级事件处理程序addEventListener方法的浏览器 if(dom.addEventListener){ dom.addEventListener(dom,type,fn); }else if{ //对于不支持addEventListener方法但支持attachEv...

2018-03-02 10:33:12 990

原创 react中禁止复制的写法

<div onCopy={(e) => e.preventDefault()}>这一段文字禁止被复制</div>此方式能实现局部禁止复制这里介绍的是个人觉的最好的一种方式，原理是禁止复制这个方法调用。此外，你还可以从css的角度去解决，代码如下:<div className="test">这一段文字禁止被复制</div>css:.t...

2018-02-27 11:46:25 2814

qq_29854831的博客