JavaScript
老李头的代码生活
我很懒,没有写什么简介的啦- -,日常沉迷敲代码
展开
-
获取url内的参数数据
例如我们的页面 是含有参数的 类似于 www.baidu.com?userdata=百度用户 我们想获得 url内的userdata的数据值 那么就需要 使用下方这个正则判断方式来进行计算 window.location.href 这个可以获得 window对象内的location的href 也就是我们当前页面的地址 然后通过语法正则判断问号 ? 后面的数据 // 获取url的数据参数 let url =window.location.href // /...原创 2022-04-07 16:39:57 · 1486 阅读 · 0 评论 -
非脚手架vue兼容IE和360兼容模式方法
哎 今天麻了 用非脚手架的vue和el-ui来写页面 结果发现 不兼容ie浏览器 这里我通过百度 确认了几种方法但是都没有实现 最后实现的就是 Releases · babel/babel-standalone · GitHub 通过这个链接 下载 babel 来进行设置 第一步先下载 下载min版本的 轻量 然后 第二步 <script src="./js/babel.min.js"></script> 引入后 第三步 在你要写JavaScri...原创 2022-04-01 20:30:59 · 1523 阅读 · 3 评论 -
知识点----为数组对象每一个对象添加新的键值对
常用于 赋予判断条件等等操作 Arrobject = Arrobject.map(function(o) { o.isActive = false; return o; }) 效果原图 不包含 isActive :false 这个数据 我们加载上方语句后 嗯 又学到了一个以前忘记的小知识 ...原创 2022-03-31 22:22:11 · 857 阅读 · 0 评论 -
多维数组对象去重
这是我在工作中遇到的 通过我个人不屑的努力。。。。。百度 从而解决 多维数组对象去重 let len = objarray.length; let tempJson = { }; let res = []; for(let i = 0;i < len;i++){ //取出每一个对象 tempJson[JSON.stringify...原创 2022-03-09 17:52:21 · 395 阅读 · 0 评论 -
DOM和BOM的区别
BOM bom 是 browser object model 的缩写 意义为 浏览器对象模型 bom 没有相关标准 bom 最根本对象是 window DOM dom 是 document object model 的缩写 意义为 文档对象模型 DOM 是w3c 的标准 DOM 最根本的对象是 document 实际上是 window.document 我们日常操作的 元素标签 都是DOM对象 ...原创 2022-02-22 18:36:42 · 111 阅读 · 0 评论 -
扁平数组转换为树状结构
本文代码只是一个例子. const data = [ {id:"01", name: "张大大", pid:"", job: "项目经理"}, {id:"02", name: "小亮", pid:"01", job: "产品leader"}, {id:"03", name: "小美", pid:"01", job: "UIleader"}, {id:"04", name: "老马", pid:"01", job: "技术leader"}, {id:"05", name: "老原创 2021-10-30 17:39:41 · 2285 阅读 · 0 评论 -
项目小技巧----封装统一管理浏览器本地缓存
场景: 比如我们在做一个项目的时候 一开始使用的localStorage 方法存入数据 但是后面 又要修改 然后又要修改 来回切换很费劲 这里教给大家一个统一封装管理 的方法\ 比如我这里保存用户的token值 存到本地localStorage 我们将本地存储方式 统一保存在一个文件里,这里我统一放到一个storage.js的文件内 这样 在我们需要使用的地方 可以引入使用了 比如刚才的localStorage的存储token值得地方 首先我们引入这个getSt...原创 2021-10-22 20:15:57 · 203 阅读 · 0 评论 -
拖拽上传图片并转换成base64格式显示
本文讲解怎么实现 将图片拖拽实现上传 且以base64格式显示出来 首先css准备一个div 要有大小和背景颜色 让我们知道该拖拽到什么地方 div { width: 200px; height: 200px; background-color: #8df; } 然后html 里面放一个div盒子 其实事物本质也是创建一个img //dragover: 判断是否有东西拖拽上来。 //d...原创 2021-10-19 11:31:34 · 267 阅读 · 2 评论 -
webpack扩展_隔行变色
webpack-案例-隔行变色 回顾从0准备环境 初始化包环境 下载依赖包 配置自定义打包命令 下载jquery yarn add jquery 3. 新建public/index.html - 前端首页 4. 新建src/main.js - webpack打包入口 index.html内容如下 <!DOCTYPE html> <html lang="en"> <head>..原创 2021-09-22 19:35:20 · 96 阅读 · 0 评论 -
ES6模块化
es6模块化 每个 js 文件都是一个独立的模块 导入其它模块使用 import 关键字 向外共享模块使用 export 关键字 commonJS规范(nodejs) 导入其它模块使用 require关键字 向外共享模块使用 mod 让nodejs支持ES6模块化 node.js 中默认仅支持 CommonJS 模块化规范,如果想基于 node.js 体验与学习 ES6 的模块化语法,需要按照如下两个步骤进行..原创 2021-09-18 22:26:57 · 74 阅读 · 0 评论 -
跨域及解决方法(jsonp和cors)
出于浏览器的同源策略限制。同源策略(Sameoriginpolicy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现。同源策略会阻止一个域的javascript脚本和另外一个域的内容进行交互。所谓同源(即指在同一个域)就是两个页面具有相同的协议(protocol),主机(host)和端口号(port) 当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨原创 2021-09-18 22:12:41 · 495 阅读 · 0 评论 -
拖拽上传图片
方法如下: css div { width: 200px; height: 200px; background: red; } html 就 放一个div即可 不进行代码书写了 累~(好像写这么多字比写div盒子跟费劲啊.....) js 需要监听div 是否有被拖拽东西上来 let div = document.querySelector('div') // 创建img // dragover:是否有东西拖拽上来了 div.addEve...原创 2021-09-15 17:06:45 · 63 阅读 · 0 评论 -
上传图片时显示图片内容
先写结构和样式 css如下 div { width: 200px; height: 200px; background-color: #8df; } 然后书写结构如下 <input type="file" name="" id="" /> <div></div> 然后js获取上传文件域 和div位置 //点击上传在div中显示图片 let file = d原创 2021-09-15 17:00:33 · 180 阅读 · 0 评论 -
数组API方法
es5: join(), sort(), slice(), splice(), concat(), reverse(), push(), pop(), shift(), unshift(), forEach(), map(), some(), every(), filter(), reduce(), indexOf(), lastIndexOf(), es6: Array.form(), Array.of(), copyWithin(), find()+findIndex(), fill(), entri.原创 2021-09-15 16:50:47 · 133 阅读 · 0 评论 -
写大事件项目接口
// 导入 const express = require('express') const multer = require('multer'); // 配置 处理formdata const upload = multer({dest:'uploads/'}) const app = express() app.use(express.urlencoded()) // 登录 app.post('/api/login',(req,res)=>{ console.log(req.body).原创 2021-09-15 15:08:22 · 141 阅读 · 0 评论 -
RESTful风格的接口
普通接口设计 只用到get和post接口 接口的地址一般由动词+名词构成 每个接口的地址都不一样 例如: 接口名:localhost:8080/getarticle 类型:get 功能:获取文章信息 接口名:localhost:8080/addarticle 类型:post 功能:添加新文章 接口名:localhost:8080/delarticle 类型:post 功能:删除文章 接口名:localhost:8080/updatearticle 类型:post 功能:原创 2021-09-15 14:58:34 · 1601 阅读 · 0 评论 -
node.js path模块的基本使用
功能:path也是node中的核心模块,作用是用来处理路径问题:拼接,分析,取后缀名等等。 使用步骤: 1.引入模块 const path = require('path') 2.使用模块. 示例: // 拼接html5.jpg的绝对路径 // 1) 找到当前文件夹的绝对路径 console.log(__dirname) // 2) 加上 html5.jpg const fs = require('fs') const path = require('path') const filePat原创 2021-09-12 10:52:04 · 212 阅读 · 0 评论 -
JavaScript实现鼠标点击拖拽移动
1.CSS首先用通配符清内外边距 然后给自己需要用的盒子加上背景图片及脱标 * { margin: 0; padding: 0; } div { width: 200px; height: 200px; background: url(./images/dog.jpg) round; position: absolute; left: 0;原创 2021-09-11 20:34:47 · 2591 阅读 · 0 评论 -
js中字符串常见api操作
str.length //获取字符串长度 str.split() //分割字符串 例如 : let str = 'How are you doing today' let arr = str.split(" ") //会将所有空格视为分隔符 来进行分隔符 而arr打印出来的效果就是 :[How,are,you,doing,today?] str.replace('原字符','新字符') //替换字符串 str.toLowerCase()和str.toUpperCase() 切换字符串内字母大小写.原创 2021-09-10 20:10:40 · 148 阅读 · 0 评论