![](https://img-blog.csdnimg.cn/20201014180756923.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
js
一枕黄粱-web
砥砺前行,未来可期
展开
-
基于Taro实现的抛物线动效
基于Taro实现的抛物线动效原创 2021-12-15 10:10:10 · 968 阅读 · 0 评论 -
canvas绘制多个矩形实现热区图功能
热区图功能:上传一张背景图,在背景图上框选指定区域,配置对应的跳转链接和领券信息canvas绘制矩形组件<template> <div class="img-intercept-content" :style="hotStyle"> <div class="imgContainer" :style="hotStyle" ref="imgContainer"> <canvas ref原创 2021-11-29 17:48:28 · 1841 阅读 · 0 评论 -
js注意点
一、三个等号和两个等号的区别(=== 和 ==)===:称为等同符,当两边值的类型相同时,直接比较值,若类型不相同,直接返回false;==:称为等值符,当等号两边的类型相同时,直接比较值是否相等,若不相同,则先转化为类型相同的值,再进行比较;类型转换规则:1)如果等号两边是boolean、string、number三者中任意两者进行比较时,优先转换为数字进行比较。2)如果等号两边出现了null或undefined,null和undefined除了和自己相等,就彼此相等注意:NaN=原创 2021-08-26 11:23:41 · 77 阅读 · 0 评论 -
js计算文本在页面所占px宽度
计算文本在页面所占px宽度 -- 扩展String原型方法pxWidth(web端适用)/*** 获取文本px宽度* @param font{String}: 字体样式**/String.prototype.pxWidth = function(font) { var canvas = String.prototype.pxWidth.canvas || (String.prototype.pxWidth.canvas = document.createElement("canvas")),原创 2021-06-28 10:10:28 · 1868 阅读 · 2 评论 -
如何优化具有许多图像和无限滚动的网页的性能
总结超前阈值的懒加载+DOM Cache和图片Cache+滚动throttle模拟+CSS fadeIn动画。原创 2021-06-09 14:52:03 · 91 阅读 · 0 评论 -
瀑布流的多种实现方式和优缺点
瀑布流相关个人建议(供参考)用flex布局+JS计算两列高度来实现。基本思路是flex-box容器下有左右两列容器(对应组件state中的list1和list2数组),从list1开始创建子项,创建后计算左右两列容器的高度来比较,高度小的列对应的list数组就会push一个子项,这样循环到列表项全部创建完为止。(因为商品流的图片区域高度是固定的,影响列表子项容器高度的只有标签,所以不用考虑图片加载完成后才能得到的高度,即不用考虑Image组件的onLoad事件,因此实现起来还是简单的)注意点:Taro3原创 2021-06-08 16:29:50 · 1015 阅读 · 0 评论 -
js数组分页
将数组进行分页,返回新的分页数组/** 将数组进行分页,返回新的分页数组 * @param {Object} pageSize 每页大小 * @param {Object} arr 数组 */function returnAllPageFunc(pageSize, arr) { let pageNum = 1 let pageObj = { pageNum: 1, list: [] } let pageResult = [] let newArr = JSON.par.原创 2021-05-31 11:53:37 · 3096 阅读 · 0 评论 -
常见 MIME 类型列表
以下代码为各文件的MIME类型,如果有个别文件在代码中找不到相应的MIME类型,可参考网站MDN网站 {".3gp", "video/3gpp"}, {".apk", "application/vnd.android.package-archive"}, {".asf", "video/x-ms-asf"}, {".avi", "video/x-msvideo"},原创 2020-12-04 11:53:41 · 587 阅读 · 0 评论 -
js常用的操作数组的方法(排序、去重、分组、数组转成tree结构数组、根据指定节点获取所有父级)
排序、去重、分组、数组转成tree结构数组、根据指定节点获取所有父级原创 2020-07-24 11:15:16 · 664 阅读 · 0 评论 -
js常用操作dom方法-修改样式篇
检测,添加,移除className原创 2020-07-16 14:42:10 · 397 阅读 · 0 评论 -
Js根据class名/id/标签在指定位置替换html标签内容
function getClass(obj, attr) { var aArray = [];//定义一个新的空数组 var i = 0; var aAll = document.getElementsByTagName('*');//获取obj对象下面所有的节点 for (i = 0; i < aAll.length; i++) { if (aAll[i].className == attr) {//判断原创 2020-06-04 11:29:26 · 1091 阅读 · 0 评论 -
ajax封装
/* 封装ajax函数 * @param {string}opt.type http连接的方式,包括POST和GET两种方式 * @param {string}opt.url 发送请求的url * @param {boolean}opt.async 是否为异步请求,true为异步的,false为同步的 * @param {object}opt.data 发送的参数,格式为对象类型 * @...原创 2019-10-31 14:39:42 · 115 阅读 · 1 评论