js
关注
分享
扫一扫
文章平均质量分 62
崽崽的谷雨
从事前端，不断积累经验，学习新的技术。头像不是本人是莉莉崽（美貌、可爱集于一身的小姐姐，小仙女），一个宝藏博主，值得喜欢！
展开
-
js 实现对一个元素得拉伸
最近写一个项目遇到了需要拉伸调整一个元素得大小（宽高）。所以打算实现一下。思路就是用 mousedown、mousemove、mouseup 来实现。mousemove是动态获取坐标，然后 动态改变元素宽度这种功能建议使用 成熟的库来实现，兼容性什么的一般都会适配。原创 2024-08-19 10:30:49 · 1134 阅读 · 0 评论 -
input 输入中文，高频触发 onchange和oninput事件（CompositionEvent API解决）
input 输入中文，高频触发 onchange和oninput事件（CompositionEvent API解决）原创 2023-10-27 13:44:40 · 5386 阅读 · 0 评论 -
js实现左右列表对齐（左边点击时，右边滚动和左边对齐。反之右边点击时，左边滚动和右边对齐）
js实现左右列表对齐（左边点击时，右边滚动和左边对齐。反之右边点击时，左边滚动和右边对齐）原创 2023-08-03 10:45:00 · 1059 阅读 · 1 评论 -
浏览器window.open()用法，以及利用其实现拦截弹出式窗口
浏览器window.open()用法，以及利用其实现拦截弹出式窗口window.open('url','_blank','toolbar=no,location=no,directories=no,status=no,menubar=no')原创 2023-02-28 13:58:44 · 5679 阅读 · 0 评论 -
xlsx 解析excel 后渲染到表格里（前端实现 解析excel渲染到表格）
xlsx 解析excel 后渲染到表格里（前端实现 解析excel渲染到表格）原创 2022-10-24 08:45:24 · 3797 阅读 · 13 评论 -
js 实现隐藏表格列
js 实现隐藏表格列。动态 渲染列原创 2022-10-19 10:15:00 · 5694 阅读 · 2 评论 -
js 实现 输入 行数和列数动态生成一个表格
你可以 绘制的时候根据x,y再设置个宽高比如，你想让一个格子是10x10那就 动态计算表格的 width,height.要求时 输入 x 和 y ，x是行 y是列 ，然后 输入 一个数 x1,y1对其 上色。2.上色 的话 根据x1找到 tr在 根据 y1找到 所在td 然后给其加个背景色。其实 表格的宽高 也可以动态，要不然 你生成的多了会很密集。自己传一个 x,y就行。tables.style.height=y*你要的每格高度。tables.style.width=x*你要的每格宽度。原创 2022-10-01 10:30:00 · 2205 阅读 · 0 评论 -
js 计算两个日期间所有的日期（moment.js实现）
js 计算两个日期间所有的日期（moment.js实现）原创 2022-09-08 11:10:32 · 7664 阅读 · 4 评论 -
js 利用window.getSelection() 实现简单的文字标注（鼠标选中文本，给其加下滑线、背景色）
js 利用window.getSelection() 实现简单的文字标注（鼠标选中文本，给其加下滑线、背景色）window.getSelection()原创 2022-08-25 09:00:00 · 15973 阅读 · 10 评论 -
vue、js onSelect事件 获取选中的值
onselect属性可用于,,,,和.主要是借用event获取其值和selectionStart选中下标起始selectionEnd选中的下标结束。然后字符串截取出来。作用当文本被选中时，执行一段Javascript代码。onselect事件会在文本框中的文本被选中时发生。vue、js onSelect事件 获取选中的值......原创 2022-07-26 08:30:00 · 6143 阅读 · 0 评论 -
js 限制鼠标移动范围
js 限制鼠标移动范围（js隐藏鼠标）js 鼠标 禁用功能js 拖拽原创 2022-06-23 17:44:18 · 5633 阅读 · 0 评论 -
js禁用浏览器 pdf 打印、下载功能（pdf.js 禁用打印下载、功能）
js禁用浏览器 pdf 打印、下载功能（pdf.js 禁用打印下载、功能）原创 2022-06-22 08:30:00 · 13945 阅读 · 15 评论 -
html canvas 烟花 特效代码
html canvas 烟花特效原创 2022-01-05 09:29:03 · 9011 阅读 · 1 评论 -
js、html实习 计数器 加减简 易购物车（js dom基础练习）
思路就是 循环生成 dom 利用 innerHtml赋值。数量加减 需要传一个 唯一标识 这样才能 知道 点击的哪个，否则就是 一点击所有的都变了。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name=...原创 2021-11-09 11:07:26 · 1035 阅读 · 0 评论 -
js 实现 输入 年月日 算出 是当年的第几天？
题目：输入年月日 ，求出 是当年的第几天？1.获取年份2.判断 年份 是否是 平年和闰年 if (year % 4 == 0 && year % 100 != 0 || year % 400 == 0) { //闰年 isyear = 29; } else { isyear = 28; //平年 }3.根据月份 ，区分大小月计算天数拿到 月 和 天计算月前面的 +天 就是 在年中的天数这个 是用数组长度...原创 2021-10-24 12:40:27 · 2853 阅读 · 0 评论 -
js实现 表格框选 并且 变色 （原生js实现在表格用鼠标框选并有反选功能）
原生js实现在表格用鼠标框选并有反选功能<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0">..转载 2021-10-12 15:08:09 · 1077 阅读 · 0 评论 -
js 控制台打印对象，对象点开后里面属性没值，展开后有值（object展开和收起值不一致）
js 打印这个对象的语句执行的时候, 对象里面的确是有值的,但是当程序继续执行,下面的代码有对这个对象赋值的语句,所以chrome控制台显示,里面有值。 打印时内存里的值已经变了 ，导致 展开和收起不一致。因为 js对象赋值 只是引用地址赋值过去了，还是指向同一个 地址。所以 js想要拷贝一个 object需要 深拷贝 最简单的就是 json.stringfly方法示例：let obj={ name:"555", age:"15" }; console.log(ob原创 2021-10-08 16:30:41 · 6143 阅读 · 0 评论 -
js 获取 一个四位数， 各个位上的值（个、十、百、千）
获取各个位上的数的方法 let D=parseInt(i % 10); //个位 let A = parseInt((i % 10000) / 1000); //千位 let B = parseInt((i % 1000) / 100); //百位 let C = parseInt((i % 100) / 10); //十位//规律 就是 先 % 在 / // 比如 万 位 parseInt((i % 100000) / 10000); //万位小练习：求所有满足条件的四原创 2021-10-08 15:10:00 · 5395 阅读 · 0 评论 -
前端粒子效果（particles.js）
炫酷的粒子效果实现下面这两种效果 particles.jshttps://www.jq22.com/yanshi9838上面这种可以使用： particles.jswebgl 或者canvas，css3该都可以 （下面是我找到的实现过程）https://blog.csdn.net/yeana1/article/details/52460490https://blog.csdn.net/csdn_yudong/article/details/53128570h...原创 2021-07-23 09:05:44 · 1655 阅读 · 0 评论 -
html字符串只匹配，标签里的内容，不匹配标签属性
场景有的时候，返回html字符串，前端需要检索出需要的值。如果是英文，并且标签上有style属性、class。匹配时也会匹配上，正确的是应该只匹配内容。例如：我匹配r就会匹配到style里的color和red里的r也会匹配明显不对。 let sText = '<span style="color: red;">aA7<a style="color: red;"></a></span>'; var rHtml = new RegExp(.原创 2021-07-02 17:33:55 · 1016 阅读 · 1 评论 -
js+html实现点击按钮列标滚动（scrollTop）
效果图实现点击上下按钮，滚动条滚动。代码如下<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-s..原创 2021-07-02 13:33:00 · 1543 阅读 · 0 评论 -
html+js实现切换图片（点击按钮切换）
效果图实现点击按钮切换图片的效果具体代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-sca..原创 2021-07-02 13:27:11 · 19462 阅读 · 3 评论 -
js编码、解码方法（escape，encodeURI，encodeURIComponent区别及用法）
前言：js解码、编码问题问题一、定义和用法1.escape() 定义和用法: escape() 函数可对字符串进行编码，这样就可以在所有的计算机上读取该字符串。该方法不会对 ASCII 字母和数字进行编码，也不会对下面这些 ASCII 标点符号进行编码： * @ - _ + . / 。其他所有的字符都会被转义序列替换。提示：使用unescape()方法对字符串进行解码。语法escape(string)参数 描述 string 必需。要被...原创 2021-05-25 15:57:57 · 8498 阅读 · 1 评论 -
判断浏览器是否支持某个CSS属性以及获取浏览器信息
前言：css属性兼容性很重要，有的时候必须兼容其他浏览器比如ie和其他各种浏览器。所以我们要知道浏览器是否支持某个属性，可以用下面的方法试试。if( attr in document.documentElement.style){ return true;}else{ return false;} 例如：判断是否支持flex属性<pre name="code" class="javascript">if( 'flex' in document.d.转载 2021-05-19 14:27:19 · 1619 阅读 · 0 评论 -
前端实现打印预览功能以及page-break-inside属性解决打印换行问题（打印预览表格或文字被分割开）
遇到的问题：打印预览的时候表格被分割了，就是一共两页而其中一行显示在不同的两个页面。如下图：原创 2021-05-18 09:48:59 · 16809 阅读 · 5 评论 -
[DOM] input 警告[DOM] Input elements should have autocomplete attributes(suggested:“current-password)
警告信息：这个虽然不影响效果，但是有的时候自动填充密码时会把密码带出来[DOM] input 警告[DOM] Input elements should have autocomplete attributes(suggested:"current-password)意思为：输入元素应具有自动完成属性 <input type="password" />定义和用法autocomplete 属性规定输入字段是否应该启用自动完成功能。自动完成允许浏览器预测对字段的输原创 2021-05-12 08:51:10 · 4030 阅读 · 0 评论 -
js实现html搜索关键词高亮显示（标红）
效果图：一、只适用于找出中文如果传入英文会特别麻烦，因为比如传个a，innerHtml匹配时会匹配到包含a的标签比如<span>、<a>等。思路：获取body的innerHtml，配合正则和字符串方法replace方法。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv..原创 2021-04-29 20:04:23 · 7356 阅读 · 1 评论 -
js indexOf使用及注意事项以及数组使用indexOf
一、定义和用法indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。语法stringObject.indexOf(searchvalue,fromindex)参数 描述 searchvalue 必需。规定需检索的字符串值。 fromindex 可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数，则将从字符串的首字符开始检索。 说明该方法将从头到尾地检索字符串原创 2021-04-16 09:39:45 · 28041 阅读 · 3 评论 -
moment（一个js时间格式化处理库）使用及踩坑
前言：moment.js是一个时间处理库，在前端经常用到比如ui框架里datePicker，rangePicker等组件会用到。一、moment.jsmoment.js官方api二、使用时出现的错误及踩坑1.Invalid date(无效的日期)说明你传入的值不是个有效的日期（找了好久才找到）。moment('1616486656000'); //这样是可以的moment('1616486656000').format('YYYY-MM-DD');//这样就不行报Inval.原创 2021-04-02 13:22:24 · 10681 阅读 · 0 评论 -
js获取url地址参数
一、js获取url地址栏参数1.传入url地址（获取某个参数） console.log(getQueryVariable('aid', "http://10.179.91.238:8000/?box=11&aid=696772&xx=22")) function getQueryVariable(variable, url) { // var query = window.location.search.substring(1); //这个是从浏览器地址栏获原创 2021-04-01 08:56:47 · 525 阅读 · 0 评论 -
js找出两个数组，相同的项
1.使用filter和indexOf方法 arrHasSameValue = (arr1, arr2) => { return arr1.filter(item => { if (arr2.indexOf(item) > -1) { return item; } }) }2.双重for循环arrHasSameValue = (arr1, arr2) =&g原创 2021-03-29 17:47:10 · 9380 阅读 · 0 评论 -
js、react、vue里滚动到底部加载数据和滚动到顶部实现（js监听滚动事件，到底部请求接口）
前言：最近在做一个项目，一个列表展示原本是分页器，点击下一页，请求接口。但是业务说需要改成滑倒底部，加载数据。一、实现过程1.html+js<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="vi原创 2021-03-11 17:31:27 · 4773 阅读 · 0 评论 -
QQ空间自动删除说说的js脚本（亲测有效）
前言：QQ是00，90喜欢的社交软件之一，而空间也是最受欢迎的模块，发发说说，日志，花藤，家园之类的。说说就类似于朋友圈。上学那会儿基本天天发说说，现在开来好几千条，有的很幼稚，想删除，但是空间只支持单个删除，很麻烦，超级费时间！于是就在网上找到了一些脚本自动删除，操作相对简单。一、操作步骤：脚本如下：//时间间隔 var delay = 1000; //删除函数 function del() { //找到删除按钮并点击 docum.原创 2021-02-25 17:03:15 · 6140 阅读 · 4 评论 -
js运行机制事件循环与宏任务、微任务（彻底搞懂面试异步问题）
前言：最近面试总是会问一些js运行机制，事件循环，异步执行的题，所以找了几篇博客做个总结。1.最典型的js笔试题console.log('script start');setTimeout(function() { console.log('setTimeout');}, 0);Promise.resolve().then(function() { console.log('promise1');}).then(function() { conso原创 2020-07-10 23:58:47 · 585 阅读 · 0 评论 -
react使用supermap webgl
我在使用supermap webgl加载镶嵌地形的时候报错DeveloperError: Expected scalar to be typeof number, actual typeof was undefined Error。找了很久的原因原来是使用版本太低只要，更新到新版本即可（10i，9D）下载地址SuperMap iClient 3D for WebGL 一款在服务式 GIS 架构...原创 2020-04-22 16:24:04 · 1703 阅读 · 3 评论 -
react、vue、js实现文件下载导出（iframe，form,a标签）
只需要传一个文件下载地址的url即可downloadFile = (url) => {//下载方法 console.log(url) const iframe = document.createElement("iframe"); iframe.style.display = "none"; // 防止影响页面 iframe.style.height ...原创 2019-12-23 16:06:44 · 9631 阅读 · 1 评论 -
js截取文件名和后缀名(xxx.pdf)
我最近做的项目上传文件获取到文件名，需要获取文件的后缀名和文件名。用js截取字符串实现。splitFileName=(text)=> {//截取文件名格式（333.pdf） var fileExtension = text.substring(text.lastIndexOf('.') + 1);//截取文件后缀名 var pattern = /\.{1}[a-z]{1,}$...原创 2019-12-23 16:03:28 · 2614 阅读 · 0 评论 -
js把这种时间格式转换成正常的时间格式2019-12-21T11:55:10.094+0000（2019-12-21 19:55:10）
从数据库里拿到的时间格式是这样的2019-12-21T11:55:10.094+0000要转换成这样的2019-12-21 19:55:10，下面是方法：function FormatTime(time){//格式化时间 var d = new Date(time); var times=d.getFullYear() + '-' + (d.getMonth() + 1) + '-'...原创 2019-12-21 20:14:51 · 1212 阅读 · 0 评论 -
js实现把字节转换成正常单位（kb,mb）
从文件服务器获取到的文件大小是字节（bat）看着不太直观就找了个方法转换了一下function getfilesize(size) {//把字节转换成正常文件大小 if (!size) return ""; var num = 1024.00; //byte if (size < num) return size + "B"; if (size <...原创 2019-12-21 20:09:11 · 4883 阅读 · 0 评论 -
js实现px与rem的换算（移动端）vue/react
1.简单的方法：functionrem(){ document.getElement.style.fontSize=document.getElement.clientWidth/7.5+'px'}window.onload=rem()//文档加载完成执行window.onresize=rem()//当浏览器被重置大小时执行Javascript代码可参考on...原创 2019-12-11 17:39:04 · 2943 阅读 · 0 评论