JavaScript实用小功能
关注
分享
扫一扫
文章平均质量分 70
本专栏分享JavaScript许多常用的小功能，来提高前端网页的开发速率，请大家参考
念你那丝微笑
前端开发界的一名小学生，前端知识点很系统化，内容很杂，边界很宽，需要学习的知识多而用的少，
，希望通过博客来记录和加深学习交流，不足之处，欢迎大佬批评指正。
展开
-
前端常用的上传下载文件的几种方式，直接上传、下载文件，读取.xlsx文件数据，导出.xlsx数据
【代码】前端常用的上传下载文件的几种方式，直接上传、下载文件，读取.xlsx文件数据，导出.xlsx数据。原创 2023-08-13 11:59:48 · 2776 阅读 · 0 评论 -
正则表达式常用的函数及用法说明
test()：测试一个字符串是否符合某个正则表达式的规则，返回布尔值。match()：在一个字符串中查找符合某个正则表达式的内容，返回匹配结果的数组或 null。replace()：将一个字符串中符合某个正则表达式的内容替换为指定的字符串或函数，返回替换后的新字符串。search()：在一个字符串中搜索符合某个正则表达式的内容，返回第一个匹配结果的位置，如果没有找到则返回 -1。split()：将一个字符串按照符合某个正则表达式的内容进行分割，返回分割后的数组。例如：原创 2023-05-12 15:26:12 · 2469 阅读 · 1 评论 -
JS实现轮播图的三种简单方法。
Js实现轮播图01实现思路这可能是轮播图最简单点的实现之一，通过更改图片的src来实现该效果，首先需要将图片命名格式统一比如pic01.jpg，pic02.jpg…,再通过js使用定时器去改变img标签里面的src图片链接的名字来实现切换效果。代码如下：实现效果<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>轮播图实现01</title> &原创 2020-08-13 23:55:00 · 77214 阅读 · 59 评论 -
JS小功能：贪吃蛇游戏简单的实现
实现思路在贪吃蛇游戏的实现中，主要创建了五个对象来实现游戏的搭建，分别为：Tools：工具对象，产生随机数Food：食物对象，在地图上随机产生食物Snake：蛇对象，创建蛇，控制蛇移动，吃食物实现Game：游戏对象，创建键盘监听器，控制蛇移动的方向，蛇与边界的判断Main：调用对象，运行游戏本贪吃蛇主要通过构造函数，面对对象来实现，比较简陋，需要的可以参考一下，请多多指教。游戏效果：HTML<!DOCTYPE html><html> <head>原创 2020-08-06 23:00:29 · 239 阅读 · 0 评论 -
JS实现点击回到顶部并改变导航栏高度
实现思路HTML部分给导航栏及回到顶部css设置为固定定位fixed，通过js的onscroll滚动事件获取页面滚动距离进行判断，当滚动距离大于10时，显示回到顶部按钮，改变导航栏高度。当点击回到顶部按钮时，调用定时器方法，改变scrollTop的值回到顶部。HTMLhead导入向上箭头链接<link href="//netdna.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" rel="stylesheet">原创 2020-08-01 17:35:06 · 507 阅读 · 0 评论 -
JavaScript实现无限滚动加载瀑布流
实现思路JS无限瀑布流的实现，先定义两个div，通过css把父div设置为相对定位，子div设置为绝对定位（子绝父相），通过js改变div的相对定位，来实现瀑布流的加载。在js实现中：1 获取到.itemBox 宽度2 获取到.item 宽度3 求出列数4 求出间距5 调用waterFull()，getMin(arr)方法实现瀑布流布局：6 调用waterFull()方法实现滚动页面时加载数据html+CSS代码<!DOCTYPE html><html lang="e原创 2020-08-01 12:31:04 · 1452 阅读 · 0 评论