js
石界星空
我的梦,在星空深处
展开
-
js 常用的几种 图片下载的功能总结
几种常用的图片下载及会遇到的问题1、同源路径直接用a标签+download 属性:<a href="https://baidu.com" download="百度.jpg">下载</>或者用blob文件流的形式:// 获取图片文件流download (row) { const imgUrl = row.fileUrl let xhr = new XMLHttpRequest() xhr.open('get', imgUrl, true) // 至关重要原创 2022-03-30 22:20:28 · 1271 阅读 · 0 评论 -
vue -- 页面过多热更新加载过慢解决方案
解决方案:babel-plugin-dynamic-import-node安装:npm install babel-plugin-dynamic-import-node --save-dev使用配置:1、如果你使用的是:.babelrc就在.babelrc文件中添加:2、如果你使用的是:babel.config.js修改文件module.exports = { presets: [ '@vue/app' ], env: { development: { plugins原创 2021-09-01 15:23:15 · 2079 阅读 · 0 评论 -
根据id找节点
场景:给出一个节点树,根据id找出对应的节点节点树:let tree = { id: 1, children: [ { id: 2, children: [ {id: 3}, { id: 5, children: [ {id: 6} ] }, null ] }, { id: 4 }, null ]}// 写一个方法function getNode(root, id) {/原创 2021-08-05 12:19:19 · 814 阅读 · 0 评论 -
一个简单的抽奖函数
假定场景:写一个方法,返回 1,2,3,4 表示四种奖品,这四种奖品的概率分别是 5%,15%,25%,55%;思路,利用Math.random()的随机数,然后将四种奖品填满一个100长度的数组容器中,随机抽取;上代码:function getReward() { let arr1 = new Array(5).fill(1); let arr2 = new Array(15).fill(2); let arr3 = new Array(25).fill(3); let arr4 = new原创 2021-08-05 09:26:08 · 541 阅读 · 0 评论 -
axios请求-- 取消上一次的请求
问题场景:很多时候,我们的提交按钮联系点好多次,或者我们的change事件联系触发好多次,但是可能有的请求返回错误,有的有数据,接着,在接口请求超时或者是返回成功的时候,就会出现页面上可能一直在弹出请求失败的消息,而下拉中缺有数据的尴尬请求。为了解决这个问题,我们需要对axios进行处理:引入axiosimport axios from 'axios'; const CancelToken = axios.CancelToken;在全局先定义一个cancle变量window.cancle=nu原创 2021-08-02 11:33:19 · 839 阅读 · 0 评论 -
async、await、Promise、setTimeout执行顺序
先看一段代码: async function a2() { console.log(3) } async function a1() { console.log(1) await a2(); console.log(2); } console.log(4) a1() setTimeout(()=> { console.log(5) }) new Promise((resolve, reject)=>{ console.log原创 2021-07-28 11:21:27 · 134 阅读 · 0 评论 -
2020-08-12
import { axios } from '@/utils/request'/** file:文件对象*/function upFile (file) { const fileList = [ file] const formData = new FormData() fileList.foreach(file => { formData.append('file',file ) }) axios({ url:url, method: 'post',原创 2020-08-12 19:51:42 · 102 阅读 · 0 评论 -
递归--由子级寻找父级
/** arr原始数组;orgCode:子级code* this.orgCodeList:存放获取的数据* 主要思想就用递归的方式来循环原始数组*/getOrgCode (arr, orgCode) { for(let i= 0; i < arr.length; i++) { const item = arr[i] if (!orgCode) { return false } else if (item.orgCode === orgCode) { this.org原创 2020-06-04 17:53:22 · 1883 阅读 · 0 评论 -
vue 刷新 当前页面
场景页面需要重置刷新的地方刷新当前页有可以采用一下3种方式1、window.location.reload()是原生JS提供的方法,整个浏览器进行了重新加载,闪烁,体验不好2、this.$router.go(0)是vue路由里面的一种方法,整个浏览器进行了重新加载,闪烁,体验不好3、通过路由跳转的方法刷新,具体思路是点击按钮跳转一个空白页,然后再马上跳回来4、provide / i...原创 2019-11-27 15:20:11 · 159 阅读 · 0 评论 -
js 文件下载/上传 进度条
/** * 下载文件 - 带进度监控 * @param url: 文件请求路径 * @param params: 请求参数 * @param name: 保存的文件名 * @param progress: 进度处理回调函数 * @param success: 下载完成回调函数 * eg: progressDownLoad({url:'http://loacalhost:...原创 2018-10-10 17:29:07 · 4509 阅读 · 0 评论 -
获取 鼠标左键选中的文本
if (window.getSelection) {//一般浏览器 userSelection = window.getSelection();} else if (document.selection) {//IE浏览器、Opera userSelection = document.selection.createRange();}userSelection=userSelect...原创 2018-09-26 14:26:31 · 2360 阅读 · 0 评论 -
php字符代表意思
php字符代表意思:“\0” — NULL “\t” — 制表符 “\n” — 换行 “\x0B” — 垂直制表符 “\r” — 回车 ” ” — 空格原创 2018-07-16 11:23:28 · 476 阅读 · 0 评论 -
js递归遍历json所有数据
//递归遍历json所有数据function getAllJson(jsons, name, sign) { if(name == "" || name == undefined) { name = "json" } for(key in jsons) { var k = name + sign + key; if(!...原创 2018-07-09 17:08:25 · 11122 阅读 · 0 评论 -
file 上传图片并获取图片路径
function getObjectURL(file) { var url = null; if (window.createObjectURL != undefined) { url = window.createObjectURL(file) } else if (window.URL != undefined) { url = windo...原创 2018-05-21 14:33:15 · 6353 阅读 · 1 评论 -
获取URL参数的一个封装方法
url格式:”https://mp.csdn.net/mdeditor?a=1&amp;amp;b=2&amp;amp;c=3“;封装方法:var common = function(){ // 获取url参数 function getQueryString() { var qs = location.search.substr(1), // 获取url中&quot;?&quot;符后的字串...原创 2018-05-14 09:46:10 · 1160 阅读 · 0 评论 -
判断照片大小 及类型
//判断照片大小 function getPhotoSize(obj){ photoExt=obj.value.substr(obj.value.lastIndexOf(“.”)).toLowerCase();//获得文件后缀名 if(photoExt!=’.jpg’){ alert(“请上传后缀名为jpg的照片!”); return false; } ...原创 2018-05-08 22:22:45 · 257 阅读 · 0 评论 -
获取当月第一天和最后一天
/** * 获取当前月的第一天 */ function getMonthFirst(){ var date=new Date(); date.setDate(1); date=getyear(date); date=date.split(’ ‘)[0]+” 00:00:00”; date=getyear(date); return date; } /** ...原创 2018-04-24 13:16:09 · 1405 阅读 · 0 评论 -
手机压缩 上传照片/删除照片
// 生成识别码 var dates = new Date(); var tIdentifier = dates.getTime(); var identifier = String(tIdentifier) + parseInt(Math.random() * 10000000); console.log("识别码" + iden...原创 2018-03-26 15:09:57 · 640 阅读 · 0 评论 -
计算某天的前/后n日
//计算某天的前/后n日function GetDateStr(AddDayCount,date) { var dd = new Date(date); dd.setDate(dd.getDate()+AddDayCount);//获取AddDayCount天后的日期 var y = dd.getFullYear(); var m = dd.getMonth()+...原创 2018-03-20 09:55:14 · 172 阅读 · 0 评论 -
jQuery的load()方法及其回调函数
<!DOCTYPE html><html><head><script src="js/jquery.min.js"></script><script>$(document).ready(function(){ $("button").click(function(){ $("原创 2018-03-23 14:27:43 · 2769 阅读 · 0 评论 -
判断浏览器是否支持placeholder属性
//判断浏览器是否支持placeholder属性function isSupportPlaceholder() { var input = document.createElement('input'); return 'placeholder' in input;}如果支持,返回true,否认在false;运用:// 如果不支持placeholder,用jQuery来...原创 2018-10-17 10:03:28 · 493 阅读 · 0 评论 -
js中文按首字母排序
var array = ['武汉', '北京', '上海', '天津','','am','pam','1213','123'];var resultArray = array.sort( function compareFunction(param1, param2) { return param1.localeCompare(param2,"zh"); });...原创 2018-11-05 16:46:26 · 10711 阅读 · 2 评论 -
js 写自定义回调函数callback
第一种形式:/** 构造回调函数* @param:p1* @param:callback 回调函数*/function testfn(p1 ,callback) { console.log('调用第一次函数-->'+p1); if(callback){ callback(p1); }}//回调函数function testcallback(p){ consol...原创 2018-11-17 23:04:13 · 4534 阅读 · 1 评论 -
js 拉动边框改变大小网络版
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Ty转载 2017-05-07 22:24:42 · 1562 阅读 · 0 评论 -
js 数组扁平化 总结
数组扁平化的几种方法本文是从网上找来的大佬文章,作了些许总结,方便用时调用,参考来源定义一个数组 const arr = [1, [2, 3, [4,[5,6,[7,8,[9,0]]]]]]一、ES6 给出的 flat() 和 flatMap()es6数组方法flat()默认只会“拉平”一层,如果想要“拉平”多层的嵌套数组,可以将flat()方法的参数写成一个整数,表示想要拉平的层数,默...原创 2019-09-23 16:34:30 · 282 阅读 · 0 评论 -
小程序mpvue中flyio的使用
Fly.js 一个基于Promise的、强大的、支持多种JavaScript运行时的http请求库. 有了它,您可以使用一份http请求代码在浏览器、微信小程序、Weex、Node、React Native、快应用中都能正常运行。同时可以方便配合主流前端框架 ,最大可能的实现 Write Once Run Everywhere。本文主要介绍一下如何在微信小程序中使用flyio的配置。npm安装:...原创 2019-05-23 17:44:19 · 1198 阅读 · 0 评论 -
两种勉强可以获取js 顶层对象的方法,适用于浏览器/nodejs/webworker
浏览器里面,顶层对象是window,但 Node 和 Web Worker 没有window。浏览器和 Web Worker 里面,self也指向顶层对象,但是 Node 没有self。Node 里面,顶层对象是global,但其他环境都不支持。方法一:var getGlobal = function () { if (typeof self !== 'undefined') { r...转载 2019-05-30 15:33:48 · 513 阅读 · 0 评论 -
读取excel文件内容,vue+element封装的一个组件
准备:1、引入elementUI(安装详见官网);2、引入插件js-xlsx(安装:npm install xlsx --save )3、import XLSX from ‘xlsx’<template> <div> <input ref="excel-upload-input" class="excel-upload-input" type="f...原创 2019-04-25 10:15:33 · 714 阅读 · 0 评论 -
前端导出数据(需要有一个数据流)
这里用的是后台传的一个数据流,利用new Blob()来导出数据:postOrderExportList(obj).then(res => { if (window.navigator.msSaveOrOpenBlob) { navigator.msSaveBlob(blob, '订单.xls'); } else { ...原创 2019-04-24 19:38:27 · 903 阅读 · 0 评论 -
js实现图片上传并预览功能
中心步骤:(1)首先需要定义好一个,src为空或者是默认图片,(2)如果src为空,就给定义好的img设置为透明:opacity:0;如果不是透明的话,会显示一个图片的标志,不美观。(3)点击上传图片后,获取上传的图片的src,将它赋值给事先定义好的,再给设置opacity:1;方法一:html代码:<div id="imgPreview"> <div id="pr...转载 2019-03-20 11:44:59 · 5972 阅读 · 0 评论 -
js 对比json数据
原理:利用递归遍历对比,遇到不相等就return false;/** 对比两个json数据* @param:obj1* @param:obj2* @return */function compreObj(obj1, obj2) { var flag = true; function compre(obj1, obj2) { if (Object.key...原创 2018-12-24 14:44:00 · 4643 阅读 · 0 评论 -
JS 调用函数内部的函数(可以这样的理解:通过一个函数可以调用另一个函数的内部函数)
可用两种方法实现:1、实例化函数为对象;2、闭包返回内部值。一、实例化函数为对象/** 创建函数--面向对象*/var objfn = function() { this.a = function(arg){console.log(arg);} this.b = function(arg){console.log(arg+1);} } /*创建实例*/var fn = n...原创 2018-12-22 15:47:37 · 17519 阅读 · 0 评论 -
自定义扩展js函数库---string.replaceAll()---字符替换所有指定字符
/* * 自定义扩展js函数库 * @time:181203 * @add : string.replaceAll()---字符替换所有指定字符 *//* * string.replaceAll()---字符替换所有指定字符 * @parameter: FindText--原文本要替换值 * @parameter: RepText--将要替换值 */String.prot...原创 2018-12-03 13:50:22 · 550 阅读 · 0 评论 -
禁右键,禁f12
禁右键,禁f12 document.oncontextmenu = function () { return false; }; document.onkeydown = function () { if (window.event && window.event.keyCode == 123) { event.keyCode =...原创 2018-02-23 15:00:34 · 279 阅读 · 0 评论 -
input 限制输入数字
input框限制输入数字onkeyup="this.value=this.value.replace(/[^0-9-]+/,'');"原创 2018-01-16 13:15:42 · 258 阅读 · 0 评论 -
数字 输入正则控制
onkeyup="this.value=this.value.replace(/[^0-9-]+/,'');"原创 2017-10-30 13:31:25 · 248 阅读 · 0 评论 -
隐式类型转换
JavaScript的数据类型分为六种,分别为null,undefined,boolean,string,number,object。object是引用类型,其它的五种是基本类型或者是原始类型。我们可以用typeof方法打印来某个是属于哪个类型的。不同类型的变量比较要先转类型,叫做类型转换,类型转换也叫隐式转换。隐式转换通常发生在运算符加减乘除,等于,还有小于,大于等。。typeof '11' //转载 2017-07-01 11:51:32 · 373 阅读 · 0 评论 -
将border-bottom-color用函数转成驼峰命名法
中心思想: 1、利用split()将字符串装换成数组; 2、利用substr()或者charAt()拿到数组的第二个元素的首字符,用uppercase()转换成大写的; 3、将转换成大写的首字符与剩下的字符拼接成新的字符串; 4、最后与数组的第一个元素拼接成驼峰命名形式;<!DOCTYPE html><html> <head> <meta charset="UTF-原创 2017-06-30 19:59:19 · 765 阅读 · 0 评论 -
查找字符串中出现最多次数的字符及其个数
中心思想: 1、利用string对象中的charAt()的方法将字符串中的每一个字符找出; 2、利用json[char]属性对每一次出现的字符进行计数; 3、进行最后的次数比较;得出出现最多的字符及其次数;<!DaCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </h原创 2017-06-30 19:49:51 · 1110 阅读 · 0 评论 -
本地对象、宿主对象、内置对象
本地对象(native object):独立于宿主环境的 ECMAScript 实现提供的对象;宿主环境:用户的机器环境,包括操作系统和浏览器。内置对象(built-in object):由 ECMAScript 实现提供的、独立于宿主环境的所有对象,在 ECMAScript 程序开始执行时出现;Global对象和Math对象;宿主对象(host object):由 ECMAScript 实现的宿主原创 2017-06-29 15:58:10 · 541 阅读 · 0 评论