- 博客(148)
- 问答 (1)
- 收藏
- 关注
原创 原生js获取 一个dom元素距离页面可视区域的位置值 -- getBoundingClientRectgetBoundingClientRect()...
这个方法返回一个矩形对象,包含四个属性:left、top、right和bottom。分别表示元素各边与页面上边和左边的距离。var box=document.getElementById('box'); // 获取元素alert(box.getBoundingClientRect().top); // 元素上边距离页面上边的距离alert(box.getBoundingClientRect().r...
2020-01-05 07:06:35
1661
原创 React中获取DOM节点的两种方法
React提供的获取DOM元素的方法有两种,一是react-dom中的findDOMNode(),二是refs。1、findDOMNodefindDOMNode通常用于React组件的引用,其语法如下:import ReactDOM from 'react-dom';ReactDOM.findDOMNode(ReactComponent);复制代码当组件被渲染到DOM中后,findDO...
2020-01-05 07:06:06
9713
原创 [转]JS如何判断一个对象是否为空、是否有某个属性
原文地址:https://www.cnblogs.com/crackedlove/p/10039105.html一、js判断一个对象是否为空 方法一:let obj1 = {}let obj2 = {a:1}function empty(obj){ for (let key in obj){ return false; //非空} return true; ...
2020-01-05 07:04:09
578
原创 React.PureComponent 和 forceUpdate 小结
forceUpdate()方法:Sub.jsclass Sub extends React.Component{ construcotr(){ super(); this.name = "yema"; } refChangeName(name){ this.name = name; this.forceU...
2020-01-03 03:28:58
402
原创 react获取滚动的高度
例1:handleScroll(e){ let clientHeight = this.refs.bodyBox.clientHeight; //可视区域高度 let scrollTop = this.refs.bodyBox.scrollTop; //滚动条滚动高度 let scrollHeight = this.refs.bodyBox.scrollHeigh...
2020-01-03 03:18:37
7098
原创 React的生命周期
1. 挂载卸载过程1.1.constructor()1.2.componentWillMount()1.3.componentDidMount()1.4.componentWillUnmount ()2. 更新过程2.1. componentWillReceiveProps (nextProps)2.2.shouldComponentUpdate(nextProps,nex...
2020-01-03 03:13:34
479
原创 js数组与字符串的相互转换方法
1、数组转字符串需要将数组元素用某个字符连接成字符串,示例代码如下:var a, b;a = new Array(0,1,2,3,4);b = a.join("-"); //"0-1-2-3-4"复制代码2、字符串转数组实现方法为将字符串按某个字符切割成若干个字符串,并以数组形式返回,示例代码如下:var s = "abc,abcd,aaa";ss = s.split("...
2019-12-04 07:55:22
357
原创 原生js判断某个元素是否有指定的class名的几种方法
如果不考虑兼容IE10以下的话,可以用HTML5中的classList API,非常方便:var node = document.getElementById('demo');if(node.classList.contains('test')){ console.log('包含 test 这个class');}复制代码兼容的方式是采用className和getAttribute(...
2019-12-04 07:53:37
1944
原创 JavaScript 可以使用以下两种方式,统计一个字符串占据的字节长度:
new TextEncoder().encode('????⛰️').byteLength // 10,或者new Blob(['????⛰️']).size // 10
2019-12-02 09:38:17
190
原创 4种js原生修改css样式的方法
html <p id = "target"> rainbow </p>复制代码1. Inline stylesdocument.getElementById('target').style.color = 'tomato'复制代码2. Global stylesvar style = document.createElement('style');styl...
2019-11-28 01:13:57
5218
转载 git clone项目失败,Host key verification failed.
在码云上创建了一个项目,配置好公钥后,克隆到我本地出现以下失败百度了好久也没有找到解决办法,困扰了好久,后来还是百度到了,原来是在提示ECDSA key fingerprint is SHA256:FQGC9Kn/eye1W8icdBgrQp+KkGYoFgbVr17bmjey0Wc.Are you sure you want to continue connecting (yes/no)...
2019-08-27 03:52:05
1507
转载 使用node-inspector调试Node.js应用
如果你在编写Node.js代码,node-inspector是必备之选,比Node.js的内置调试器好出许多。使用起来跟Chrome的javascript调试器很相似。使用npm安装:$ npm install -g node-inspector安装过程如出现“未能加载 Visual C++ 组件VCBuild.exe”类错误,参考该文章点击打开链接然后需要通过浏览器连接到node-ins...
2019-08-26 10:08:21
113
转载 js 获取dom元素的八种方法
普通的6种1.通过ID获取(getElementById)2.通过name属性(getElementsByName)3.通过标签名(getElementsByTagName)4.通过类名(getElementsByClassName)5.获取html的方法(document.documentElement)6.获取body的方法(document.body)特别的2种1.通过css...
2019-08-23 08:41:23
316
转载 创建ssh key
1、安装git工具下载地址:git-scm.com/downloads2、桌面右键鼠标,选中 “Git Bash here”3.输入cd ~/.ssh/,进入.ssh文件夹出现 “No such file or directory”,你可以手动的创建一个 .ssh文件夹即可mkdir ~/.ssh4.配置全局的name和email,这里是的你github或者bitbucket的nam...
2019-08-19 09:58:32
397
原创 fatal: HttpRequestException encountered解决方法
之前在windows下一段时间git push都没什么问题,最近一旦提交就会弹出无论是push前先将远程仓库pull到本地仓库,还是强制push都会弹出这个问题。网上查了一下发现是Github 禁用了TLS v1.0 and v1.1,必须更新Windows的git凭证管理器,才行。https://github.com/Microsoft/Git-Credential-Man...
2019-07-31 16:29:00
1713
原创 input表单禁止输入空格
input在标签内设置禁止输入空格,通过正则匹配解决问题此处涉及\s:匹配任意空白符 \S:匹配任意非空白字符<input type="text" onkeyup="this.value=this.value.replace(/\s+/g,'')">...
2019-03-06 16:10:20
1142
原创 扩展js的String对象
有些时候我们需要对字符串做一些原生js不支持的复杂操作,可以考虑扩展String对象 String.prototype.delHTMLTag = function(){ return this.replace(/<[^>]+>/g,"");//删除html标签 } var str = '<strong>likai</...
2019-03-06 10:51:02
459
转载 Cannot set property 'render' of undefined at normalizeComponent...
在做vue项目的时候报了这么个错误,找了半天不知道是什么错,后来发现是在vue文件写了script标签对,却没写export default {} 这句语句...ok,问题解决了。...
2019-03-04 19:28:10
667
原创 vue h5移动端禁止缩放
安卓在index.html里面写<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">ios在APP.vue里面写<script>window.onload = function() { doc...
2019-03-04 19:27:45
6633
1
原创 CSS自动换行、强制不换行、强制断行、超出显示省略号
P标签是默认是自动换行的,因此设置好宽度之后,能够较好的实现效果,但是最近的项目中发现,使用ajax加载数据之后,p标签内的内容没有换行,导致布局错乱,于是尝试着使用换行样式,虽然解决了问题,但是并没有发现本质原因,本质在于,我当时获取的数据是一长串的数字,浏览器应该是对数字和英文单词处理方式相近,不会截断。先给出各种方式,再具体介绍每一个属性。强制不换行p { white-space...
2019-03-04 19:27:07
217
转载 利用JS获取用户当前ip地址
新浪的IP地址查询接口:http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js(默认为纯文本格式,根据format的参数定义,还可以返回JS、Json格式)。新浪多地域测试方法:http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js&ip=219....
2019-02-27 18:40:25
6367
原创 Web端的邮件内容HTML格式规范总结
一、页面要求1) 统一使用标准的页头和页尾2)统一使用gb2312编码格式3)页面显示宽度400px-800px,高度一般控制在一屏以内。4)页面不向出现js代码及flash内容(如需要动画全用gif)5)页面所有图片必须为绝对地址6)页面的内容最好以文字的形式来呈现。二、代码要求1)使用table而已来制作页面,且必须设置宽度,而div格式由于有些属性不被邮件客...
2018-12-06 15:48:57
5546
2
原创 vue-cli webpack打包开启Gzip时报错
前言今天看了一下Vue-cli中webpack打包的速度,有点小慢,于是我就开始使用其自带的productionGzip功能。说明:本人用的node版本:v6.11.3,npm版本:v3.10.10,webpack版本:3.6.0,Vue版本:2.5.2,以免后期版本升级更新造成误导。下面进入正文。1. 首先打开config/index.js,找到build对象中的produc...
2018-11-15 16:46:35
4119
2
原创 vue中axios处理http发送请求的示例(Post和get)
本篇文章主要介绍了vue中axios处理http请求的示例(Post和get),这里整理了详细的代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 本文介绍了vue中axios处理http发送请求的示例(Post和get),分享给大家,具体如下:axios中文文档 https://github.com/mzabriskie/axios#using-applicationx-w...
2018-08-28 21:18:33
11069
转载 最详细的Vuex教程
什么是Vuex?vuex是一个专门为vue.js设计的集中式状态管理架构。状态?我把它理解为在data中的属性需要共享给其他vue组件使用的部分,就叫做状态。简单的说就是data中需要共用的属性。引入Vuex(前提是已经用Vue脚手架工具构建好项目)1、利用npm包管理工具,进行安装 vuex。在控制命令行中输入下边的命令就可以了。 npm install vuex -...
2018-08-28 21:17:35
1475
原创 简单说 通过CSS实现 文字渐变色 的两种方式
说明这次的重点就在于两个属性, background 属性 mask 属性 这两个属性分别是两种实现方式的关键。解释方式一效果图代码<!DOCTYPE html><html><head> <meta charset="utf-8"> <style> span { ...
2018-07-17 15:01:20
2287
原创 JS中的数组转变成JSON格式字符串的方法
有一个JS数组,如:var arr = [["projectname1","projectnumber1"],["projectname2","projectnumber2"],["projectname3","projectnumber3"]]; 想将此数组转换成JSON字符串,如:var jsonarr = [{"projectname":pr
2018-07-17 14:59:40
19962
转载 vue的双向绑定原理及实现
前言使用vue也好有一段时间了,虽然对其双向绑定原理也有了解个大概,但也没好好探究下其原理实现,所以这次特意花了几晚时间查阅资料和阅读相关源码,自己也实现一个简单版vue的双向绑定版本,先上个成果图来吸引各位:代码: 效果图: 是不是看起来跟vue的...
2018-07-17 14:57:50
317
原创 JS获取本地经纬度
一个最简单的调用方法window.navigator.geolocation.getCurrentPosition(function (position) { console.log(position.coords.latitude) console.log(position.coords.longitude)})封装好的代码如下:function getPos...
2018-07-17 14:51:55
23284
1
转载 input为file上传文件
1、去除input类型为file上传文件时默认样式和默认”选择文件”等; 2、压缩要上传的图片 3、隐藏上传按钮, 手动触发实现思路隐藏选择图片的input, 点击显示图片触发input的onchange事件// xxx.html<img id="pic" src="./images/xxx.png"><form id="uploadForm" action...
2018-06-19 19:16:34
8656
原创 html之file标签 --- 图片上传前预览 -- FileReader
记得以前做网站时,曾经需要实现一个图片上传到服务器前,先预览的功能。当时用html的<input type="file"/>标签一直实现不了,最后舍弃了这个标签,使用了其他方式来实现了这个功能。 今天无意发现了一个知识点,用html的file标签就能实现图片上传前预览,感觉很棒,记录一下!就是通过file标签和js的FileReader接口,把选择的图片文件调用readAsData...
2018-06-19 19:14:45
7162
原创 如何去除vue项目中的 # --- History模式
使用vue-cli搭建的环境,在配置好路由之后,可以看到下面的情况: 但是不难发现#的出现真的很丑陋,并且也不知道这是什么作用? 所以就去Stack Overflow上搜索了,果然还有~ 看来Stack Overflow是真的强大,你在项目中遇到的问题实际上在so上都已经被问过并且解决了,这不: 这是最高票的回答,即在vue2中将mode模式设置为history,试过之后确...
2018-06-11 14:33:29
1664
原创 vue 图片上传功能
这次做了vue页面的图片上传功能,不带裁剪功能的!首先是html代码,在input框上添加change事件,如下:[html] view plain copy<ul class="clearfix"> <li v-if="imgs.length>0" v-for='(item ,index ) in imgs'> ...
2018-06-04 11:08:18
1713
原创 通过js sdk 来进行第三方登录及授权(微博,微信,qq)
微博第三方登录及授权注册申请appkey1.打开微博开发者平台http://open.weibo.com/development2.点击创建微链接3.选择类型(选择网站接入)4.填写各项信息,并把对应的meta复制并放在html的head内(一定要绑定域名并设置回调地址)<meta property="wb:webmaster" content="xxxxxxx" />5.在html内...
2018-05-15 19:39:28
6783
原创 识别地域ip跳转页面的js,指定ip段自动跳转
1.<script src="http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js" charset="GB2312" ></script><script type=text/javascript> alert("你的IP是:" + remote_ip_info.province); if(re..
2018-05-15 15:13:15
8540
原创 vue监听对input输入的字体字数限制
<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><title>Examples</ti
2018-05-10 17:41:54
6393
原创 vue中动态获取文本换行 <br>
动态获取文本文本换行:[html] view plain copyfunction Trim(str) { //str表示要转换的字符串 return str.replace(/\n|\r\n/g,"<br/>");} 这样,就大功告成了。可是如果你是在vue中使用{{ text }}动态获取的文本这样处理。你会发现<br>会和文本一块显示出来。改成[html] vi...
2018-05-10 11:55:27
6846
2
原创 Vue2.0 之 自带浏览器里无法打开(兼容处理) - 解决方案
Vue 之 android内嵌H5页面不显示出现这个问题,原因有很多首先,别急,请看下面的推荐方案:1、找个android真机测试下(机型版本为4.4以上),真机联调测试(如果不知道怎么联调,那么请看这里:Android真机 - 联调chrome调试)2、如果报 报错 vuex requires a Promise polyfill in this browser.那么,就是兼容性不够好,请看下面...
2018-05-10 11:49:10
6795
原创 判断http请求还是https请求
1、php判断http请求还是https请求[php] view plain copy$http_type = ((isset($_SERVER['HTTPS']) && $_SERVER['HTTPS'] == 'on') || (isset($_SERVER['HTTP_X_FORWARDED_PROTO']) && $_SERVER['HTTP_X_FORWA...
2018-05-03 16:24:33
7469
原创 vuejs 2.0 fliter 搜索过滤
这是官方的例子https://cn.vuejs.org/v2/examp...这是根据你的数据在官方基础上修改的https://jsfiddle.net/ycloud/b...点击预览scriptvar vm = new Vue({ el: '#app', data: { search: '', products: [{ name: '苹果', pr...
2018-04-27 15:44:12
3073
3
空空如也
H5、JS/JQ如何调用手机震动功能
2017-01-19
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅