
JavaScript
JavaScript
晴天有点孤单
等风来,不如追风去
展开
-
axios 重试
import axios from 'axios';import { setSessionStorage, getSessionStorage, parseUrl, setCookie, delCookie, removeSessionStorage } from '../../libs/util';import { http_status } from '../../constants原创 2021-12-01 13:58:45 · 2291 阅读 · 0 评论 -
使用 js-xss 防御 xss 攻击
xss攻击是很常见的一种攻击方式,下面简单讲一下前端如何防御。讲之前简单涉及一点后端防御的方案:在前后端交互的时候做好特殊符号的转义下面重点是前端使用js-xss防御npm install xss --savemain.js引用import xss from 'xss' Vue.use(xss); Object.defineProperty(Vue.prototype, '$xss', { value: xss })// click事件被过滤3.html 中防御<p原创 2021-03-29 16:30:56 · 5027 阅读 · 0 评论 -
js让文本中选中字符串高亮显示
整体需要实现效果如下以下可以实现 标记 选中 字符串<html><head><script>var $_text = '';(function(){ document.onmousemove = function(){$_text = document.selection ? document.selection.createRange().text : window.getSelection(); } document.onmouseup原创 2020-12-14 20:28:30 · 1343 阅读 · 2 评论 -
有道 选中翻译 选中文本
<html><head><script>var $_text = '';(function(){ document.onmousemove = function(){$_text = document.selection ? document.selection.createRange().text : window.getSelection(); } document.onmouseup = function(){if($_text!='')al原创 2020-12-14 09:50:37 · 665 阅读 · 0 评论 -
原生js获取手机定位信息 geolocation
function Location() {};Location.prototype.getLocation = function (callback) { let options = { enableHighAccuracy: true, maximumAge: 1000 }; this.callback = Object.prototype.toString.call(callback) == "[object Function]" ? callback :原创 2020-12-02 11:43:54 · 2819 阅读 · 0 评论 -
前端面试进阶(vue + es6 + js)
以下内容仅为个人见解,如有错误欢迎指正~vue双向绑定原理: vue.js 则是采用数据劫持结合发布者-订阅者模式的方式, 通过Object.defineProperty()来劫持各个属性的setter,getter, 在数据变动时发布消息给订阅者,触发相应的监听回调。延伸: * Object.defineProperty() 是ES5 中一个无法 shim 的特性, 这也就是 Vue 不支持 IE8 以及更低版本浏览器的原因。 * Objec原创 2020-05-23 15:08:25 · 1178 阅读 · 1 评论 -
把数组分割为二维数组
附代码groupList(array, subGroupLength) { let index = 0; let newArray = []; while(index < array.length) { newArray.push(array.slice(index, index += subGroupLength));} return newArray;}原创 2020-05-18 16:59:02 · 1507 阅读 · 0 评论 -
JS数组的交集、并集、差集,数组去重,获取两个数组重复的元素,去除两个数组相同的元素
let arr1=[1,2,3,4,5,6]let arr2=[4,5,6,7,8,9]// 并集 数组去重 let RemoveSame=[...new Set([...arr1,...arr2])]console.log(RemoveSame) //[1, 2, 3, 4, 5, 6, 7, 8, 9]//数组交集,或得两个数组重复的元素let SamePart=arr1.fil...原创 2020-04-13 18:11:25 · 626 阅读 · 0 评论 -
基于vue+iview 时间选择插件封装处理
不定期更新<template> <div style="position: relative;display: inline-block;"> {{label}} <Date-picker v-model="params.startTime" @on-change="handleChangeStart" type="date" pl原创 2018-07-27 20:27:24 · 1305 阅读 · 0 评论 -
js 原生 全局弹窗插件 徽标提醒
原生插件session+后端存储状态定时弹窗 徽标缩小显示import oas from '../api/oas';(function modal (option) { window.onload = function () { // 先检查登陆的人是否有此功能的权限 let hasPromise = 'yyyyy'; oas.get(hasPromis...原创 2018-08-06 17:13:38 · 1271 阅读 · 0 评论 -
es6,es7,es8语法总结 =====>> (不定期更新)
ES61. var let constlet,const具有块级作用域,不具有变量提升const 用于不能被重新赋值的变量2. 箭头函数我们经常要给回调函数给一个父级的this常用办法就是 var self = this 定义一个变量接住他使用 箭头函数,this 将不会受到影响,可以直接用this调用父级的this3. 字符串includes: c...原创 2018-08-17 16:02:31 · 2130 阅读 · 0 评论 -
jsonp跨域的原理以及优缺点
在开发测试中,难免会在不同域下进行跨域操作,出于安全性考虑,浏览器中的同源策略阻止从一个域上加载的脚本获取或者操作另一个域下的文档属性,这时需要进行跨域的方式进行解决,如:使用jsonp ,iframe等1.jsonp的原理 jsonp,即json+padding,动态创建script标签,利用script标签的src属性可以获取任何域下的js脚本,通过这个特性(也可以说漏洞),服 务...原创 2018-08-20 13:37:32 · 3967 阅读 · 0 评论 -
js 怎样判断用户是否在浏览当前页面?
可以通过document.hidden属性判断当前页面是否是激活状态。兼容性:IE10+,Firefox10+,Chrome14+,Opera12.1+,Safari7.1+兼容性写法示例:var hiddenProperty = 'hidden' in document ? 'hidden' : 'webkitHidden' in document ? 'webkitHid...原创 2018-10-13 13:35:22 · 832 阅读 · 0 评论 -
js 原生插件 弹窗通知提醒 徽标
import oas from '../api/oas';(function modal (option) { window.onload = function () { // 先检查登陆的人是否有此功能的权限 let hasPromise = 'yyyyy'; oas.get(hasPromise).then(res => { if (res....原创 2018-09-29 19:44:19 · 615 阅读 · 0 评论 -
VUE脱坑/1-- 如何解决vue 赋值后原数据随赋值后的数据的变化而变化
错误示例 this.leftColumn = {...this.Columns}; this.rightColumn = {...this.Columns};正确示例 this.leftColumn = JSON.parse(JSON.stringify(this.Columns)); this.rightColumn = JSON.parse(JSON....原创 2018-10-19 14:32:46 · 12372 阅读 · 2 评论 -
vue 爬坑 之js 对象/数组 赋值/拷贝 解决VUE中赋值引用后数据双向改变的问题
浅拷贝这里就不讲了,我们直接讲深拷贝正常的数组/对象拷贝可以直接用const cloneObj = JSON.parse(JSON.stringify(Obj));这种方式可以解决相当多一部分的赋值问题,但是一些特殊属性除外(undefined/function)在vue 或者js 中有时需要对一些特殊数据处理,比如VUE中的table等…这个时候就需要用到第二种方法处理数据附代码:...原创 2018-10-23 15:02:46 · 4892 阅读 · 3 评论 -
vue如何在用户要关闭当前网页时弹出提示
正常 js 页面处理方式window.onbeforeunload = function (e) { e = e || window.event; // 兼容IE8和Firefox 4之前的版本 if (e) { e.returnValue = '关闭提示'; } // Chrome, Safari, Firefox 4+, Opera 12+ , IE 9+ r...原创 2018-10-27 15:47:54 · 23113 阅读 · 27 评论 -
qs.stringify和JSON.stringify的使用和区别
qs.stringify和JSON.stringify使用和区别qs.stringify可以通过npm install qs进行安装是一个npm仓库所管理的包。而qs.stringify()将对象 序列化成URL的形式,以&进行拼接。JSON是正常类型的JSON,请对比一下输出let ObjectDemo = {name:'weixin',age:12}; qs.stringif...原创 2018-11-16 13:22:36 · 3947 阅读 · 0 评论 -
常用的 JS正则表达式整理
一、校验数字的表达式 1 数字:^[0-9]*$ 2 n位的数字:^\d{n}$ 3 至少n位的数字:^\d{n,}$ 4 m-n位的数字:^\d{m,n}$ 5 零和非零开头的数字:^(0|[1-9][0-9]*)$ 6 非零开头的最多带两位小数的数字:^([1-9][0-9]*)+(.[0-9]{1,2})?$ 7 带1-2位小数的正数或负数:^(\-)?\d+(\....原创 2018-11-16 13:33:26 · 371 阅读 · 0 评论 -
手写 ES6 promise
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>promise对象原理详解</title> </head> <原创 2018-12-03 16:07:02 · 386 阅读 · 0 评论 -
封装原生js 获取地址栏请求参数
// 获取地址栏请求参数function getQueryString(name) { var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i'); var result = window.location.search.substr(1).match(reg); if (result...原创 2018-12-27 13:33:25 · 991 阅读 · 0 评论 -
企业微信获取扫一扫登录 获取 code
实现方法如下1.引入script&amp;amp;lt;script src=&amp;quot;http://rescdn.qqmail.com/node/ww/wwopenmng/js/sso/wwLogin-1.0.0.js&amp;quot; type=&amp;quot;text/javascript&amp;quot; charset=&amp;quot;utf-8&amp;quo原创 2018-12-27 13:39:28 · 1698 阅读 · 0 评论 -
获取两个时间之间的月份
// 获取两个时间之间的月份 getMonthBetween (start, end) { var result = [start]; var starts = start.split('-'); var ends = end.split('-'); var staYear = parseInt(starts[0]); var ...原创 2019-02-27 13:43:37 · 678 阅读 · 0 评论 -
js转码加密的方法
encodeURI(“电影”); decodeURI(“%E7%94%B5%E5%BD%B1”);escape(“电影”) decodeURI(“%E7%94%B5%E5%BD%B1”);原创 2017-08-17 09:08:16 · 824 阅读 · 1 评论 -
js封装moment 时间工具
不定期更新import moment from 'moment';/** * @Title: 时间处理-工具类提供一些便捷地工具服务 * * ===================================================================== * @Description: 工具索引 * 2、formatAddTime 时间 加法 ...原创 2018-07-27 20:26:11 · 800 阅读 · 0 评论 -
echarts图表工具方法
不定期更新let util = {};/**echarts 图表的公共方法*@params initPoorData ***** 数据处理,图表数据首尾所有为0的不展示。*/util.initPoorData = function (numData) { /* 数据为''时图表不渲染 */ let i = 0; while (i < numData.len...原创 2018-07-27 20:25:01 · 256 阅读 · 0 评论 -
实现三级导航demo
QQ JS省市区三级联动原创 2017-09-03 17:54:18 · 1469 阅读 · 1 评论 -
闭包实例
闭包演示 p {background:gold;} function init() { var pAry = document.getElementsByTagName("p"); for( var i=0; i原创 2017-09-03 17:52:20 · 203 阅读 · 0 评论 -
清除浮动
在设置浮动后会有高塌等问题出现,下面为解决方案 &::after: { clear: “both”; content: “”; display: “table”}原创 2017-08-29 21:21:52 · 214 阅读 · 1 评论 -
鼠标划入划出
<head> <meta charset="UTF-8"> <title></title> <style> * { margin: 0; padding: 0; } .box { width: 100%; height: 360px;原创 2017-09-05 20:18:14 · 1112 阅读 · 0 评论 -
欢迎使用优快云-markdown编辑器
欢迎使用Markdown编辑器写博客本Markdown编辑器使用StackEdit修改而来,用它写博客,将会带来全新的体验哦:Markdown和扩展Markdown简洁的语法代码块高亮图片链接和图片上传LaTex数学公式UML序列图和流程图离线写博客导入导出Markdown文件丰富的快捷键快捷键加粗 Ctrl + B 斜体 Ctrl + I 引用 Ctrl原创 2017-08-15 16:54:40 · 404 阅读 · 0 评论 -
简易聊天对话框
<!DOCTYPE html><html><head><meta charset="utf-8" /><title>聊天对话框</title><style type="text/css">*{font-size: 14px; padding:0; margin:0;}.main{ position: relative; margin: 20px auto; bo原创 2017-08-17 09:07:17 · 2032 阅读 · 2 评论 -
闭包
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8" /> <title>闭包演示</title> <style type="text/css"> p {background:gold;} </style> <script type="text/javascript">function init() {原创 2017-08-17 09:06:18 · 159 阅读 · 1 评论 -
BFC
一、BFC 定义:BFC(Block formatting context)直译为”块级格式化上下文”,它是一个独立的渲染区域。二、BFC布局规则: (1)内部的Box会在垂直方向,一个接一个地放置。(2)Box垂直方向的距离由margin决定。属于同一个BFC的两个相邻Box的margin会发生重叠(3)每个元素的margin box的左边, 与包含块border box的左边相原创 2017-08-17 09:03:58 · 221 阅读 · 1 评论 -
js的一些操作方法
1.呕心沥血之作2.字符串操作2-1去除字符串空格//去除空格 type 1-所有空格 2-前后空格 3-前空格 4-后空格 function trim(str,type){ switch (type){ case 1:return str.replace(/\s+/g,”“); case 2:return str.replace(/(^\s*)原创 2017-08-17 09:01:57 · 380 阅读 · 1 评论 -
js随机颜色
直接上代码,copy走直接用<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script> //随机颜色// var bgcolor = "#"+ Math.ceil(Math.random()*0xAAAAAA).toSt原创 2017-08-17 09:00:18 · 705 阅读 · 1 评论 -
修改网页内容,随心所欲改变网站显示内容
javascript:document.body.contentEditable=’true’;document.designMode=’on’;void o然后回车,你就可以随心所欲的修改这个网站啦!输入如下代码,将退出编辑状态!javascript:document.body.contentEditable=’false’;document.designMode=’on’;void o原创 2017-09-03 17:55:54 · 31877 阅读 · 11 评论 -
一些js代码优化方法,写出一手优雅的代码
js代码script> function test1(){ // 如何装逼用代码骂别人SB console.log('(!(~+[])+{})[--[~+""][+[]]*[~+[]] + ~~!+[]]+({}+[])[[~!+[]]*~+[]]',(!(~+[])+{})[--[~+""][+[]]*[~+[]] + ~~!原创 2018-01-29 14:35:55 · 1711 阅读 · 0 评论 -
javascript 总结(常用工具类的封装)
前言因为工作中经常用到这些方法,所有便把这些方法进行了总结。JavaScripttype 类型判断isString (o) { //是否字符串 return Object.prototype.toString.call(o).slice(8, -1) === 'String'}isNumber (o) { //是否数字 return Object.prot...转载 2018-07-27 20:14:36 · 233 阅读 · 0 评论 -
前端常用js方法工具封装
不定期更新let util = {};/** * 获取指定数组指定key对应的值比较,若相等则返回该value值 * @param arr Array 需要遍历的数组 * @param id string 需要对比值的 * @param find String 等待对比的值,默认对比id * @param result String 等待对比成...原创 2018-07-27 20:23:09 · 1457 阅读 · 0 评论