图片跟随鼠标样式跟随效果（附完整代码及效果）
Demo效果如下：
完整代码如下：
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <script src="./lib/jquery.js"></script> <style> html, body { margin: 0; padding: 0; overflow: hidden; ...
记一多次踩坑的可视化图形不显示问题
Code is never die !
问题综述： 不管是本文说的visjs还是echarts、highcharts… 我都遇到过一样的问题，但下次又忘了，这次就记下来，给大家提个醒，避免踩坑
因为本人公司业务的原因，经常和一些可视化的东西 “打交道”，避免不了就会出现各种各样的问题。然而最烧脑无解的不亚于：一切按照既定要求去写代码，该引的js、css文件也引了，就是可视化的图形不出来，更纳闷的是控制台还不报错…….
这里以最近使用的visjs为例，展开简单说明一下，看图干净的不能再干净了，一点报错都没有，结构和js引入如下，也是一点问题都没有，完全按照 visjs官网 定义，如下：使用的是最简单的那个例子，然而它愣是憋着不出来，给俺急坏了。
解决办法：灰常简单，修改执行此可视化的钩子，从created–>mounted 问题顺利解决！可算是憋出来了，图出来了，在出现什么问题也有地方可看了，至少不会盲人摸象…
谨以此篇文章记录一可视化坑，跳了不知多少次……
Ending…
原生JavaScript封装去除数组重复元素的去重函数
Header： 原创不易，还请大家不吝指导赐教，Code is never die！
ps：本着让更多人不止解决问题，更能够学到一点点方法的目的。
今天给大家分享一下 JavaScript 封装一个数组去重函数方法。
题目： 要求去除数组中重复的元素
① 思路： 把旧数组里面不重复的元素选取出来放到新数组中，重复的元素只保留一个，放到新数组中去重；
② 核心算法： 我们遍历旧数组，然后拿着旧数组元素去查询新数组，如果该元素在新数组里面没有出现过，我们就添加，否则不添加；
③ 常见疑问： 我们怎么知道该元素没有存在？利用新数组.indexOf(数组元素) ，如果返回时 - 1 就说明新数组里面没有改元素。
直接上代码：
// 封装函数：去除数组重复元素function uniqueArr(arr) { var newArr = []; for (var i = 0; i < arr.length; i++) { if (newArr.indexOf(arr[i]) === -1) { newArr.push(arr[i]); } &# ...
原生JavaScript封装颠倒数组元素
Header： 原创不易，还请大家不吝指导赐教，Code is never die！
ps：本着让更多人不止解决问题，更能够学到一点点方法的目的。
今天给大家分享一下 JavaScript 原生代码封装 reverse()方法。直接上代码：
// 利用封装函数翻转任意数组function changeArr(arr) { var newArr = []; for (var i = arr.length - 1; i >= 0; i--) { newArr[newArr.length] = arr[i]; } return newArr;}var arr1 = changeArr([1, 3, 4, 6, 9]);console.log(arr1); // [9, 6, 4, 3, 1]var arr2 = changeArr(['red', 'green', 'purple', 'blue']);console.log(arr2); // ["blu ...
IP地址进行函数封装处理--常见的前端封装js函数
Code is never die ！
每日一小更，主要分享一下工作中遇到的一些小问题以及觉得比较 有用可以分享给大家都东西。
想必身为前端的你，也会经常遇到这样的问题吧，接班上一位 “优秀的前端工程师”，继续完成或者维护修改他的 “佳作”，那不堪入目的html、随处可放的css，不知哪里搞来一段js以及前后端交流商量出来的接口… 只有你想不到，没有它不敢出的…
废话不多说，进入正题！今天遇到的情况是对数据IP地址进行二次封装—-修改为 boss 想要的格式和混淆加密方式如图：需要对ip进行一定规则的二次处理，这里就以一个规则为例。四组数的范围都为0~255（且不取到0、255），拿到正确的ip，四组数分别进行+5处理，比如：myip：118.19.11.253这是后台返回正确数据，处理之后变成了myip：123.24.16.4即为展现数据。
大眼一看，不同页面多个地方都有此类数据需要进行处理，果断选择封装一个函数处理（这里说明一下：我封装的不一定是最简单的，但却是真实的第一思路往下走的，重在遇到需求要有思路）逻辑没有那么复杂，直接上代码，留存备用！
packIP(ip) &# ...
在html的js中获取外部js中的多个变量和数据
Code is never die !
通常如果数据过多，我们会将数据单独拉出来存储到一个单独的 js 文件中，然后通过外部 js 引入进来使用数据。
目前比较简单而且用的比较多的是 ES6 语法规范的exports&import方法。使用方法是：
// 外部定义dataList.jsexports.dataList = { uname = 'Rain', uage = '18', year = '2021-04-22 09:30', hometown = 'China',}
使用数据的index.html文件<script> import { dataList } from './data.js'; console.log(dataList);</script>
当然在项目中使用完全没有任何问题，但是当你测试或者单独两个文件这样使用的话就会出现问题，因为这种方法是 ES6 语法规范下的方法 ...
Uncaught TypeError_ Illegal invocation报错简单直接解决方案
Code Is Never Die !
环境： jQuery、Ajax、formData；
描述： 用于上传PDF、doc等文件时，文件POST请求需要通过使用formData作为data的属性值传入，这样才能正确的得到文件信息，但是今天出现了这个错误。
解决：修改ajax请求的内容部分，增加下面两个属性：
// 告诉jQuery不要设置Content-Type请求头，无分界符// 默认true，有分界符，导致服务器无法正确识别文件起始位置contentType: false,// 告诉jQuery不要去处理发送的数据// 默认为true，会将文件等数据转换为查询字符串processData: false,
最常见的前端小案例---筛选商品
Code is never die !
1.0 定义数组对象数据var data = [{ id: 1， pname: '小米'， price: 3999 }， { id: 2， pname: '苹果'， price: 999 }， { id: 3， pname: '华强北'， price: 1299 }， { id: 4， pname: '华为'， price: 1999 }， ];
2.0 使用 forEach 遍历数据并渲染到页面中data.forEach(function (value) { v ...
不得不知道的事儿---前端Gojs之去除水印
Code is never die !刚开始是这个样子的，带有水印，显得特别难看，太影响界面了吧 ！打开你项目引入的 go.js 文件，然后甭管其他的，直接ctrl+f 然后复制这段文字5da73c80a36755dc038e4972187c3cae51fd22，然后就能查找到图中所示位置了此时就是从 b[c]开始的内容，一直到 if(…)这里，全部注释掉！直接ctrl+s保存，本来将信将疑，然而奇迹般地就出现了下图：附记录：今天发现这个地方可能长得不太一样，不过影响不大，都差不多，而且效果都能显示出来（以下亲测）Ending…
推荐收藏：11招在手，各类表格需求——妈妈再也不用担心啦 ！
Code Is Never Die !
JavaScript 表格控件可以操作大数据集的HTML表格，提供各种功能，如分页、排序、过滤以及行编辑。在本文中，我整理了 11 个最好的 JavaScript 表格插件分享给同为开发人员的大家，大家可以很容易地添加表格操作功能到Web应用程序中。
1. DataTable地址：DataTables
DataTables 是 jQuery、JavaScript 库的插件。它是一个高度灵活的工具，基于渐进增强的基础，并将向任何 HTML 表格添加高级交互控件。该库包括分页、即时搜索和多列排序，并支持几乎所有数据源，如 DOM、JavaScript、Ajax 和服务器端处理。
2. Handsontable地址：Handsontable
Handsontable 是用于创建出色应用程序的可扩展电子表格解决方案。这个开箱即用的解决方案带有 CLI 工具，因此您可以使用任意数量的插件构建您的作品。更重要的是，Handsontable 是一张空白画布，因此您可以创建自己的外观和感觉。
Handsontable 是用纯 JavaScript 编写的，也可用 ...