![](https://img-blog.csdnimg.cn/20201014180756922.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Html Css Js
文章平均质量分 56
PGD_606
这个作者很懒,什么都没留下…
展开
-
前端兼容处理接口返回的文件流或json数据
前端兼容处理接口返回的文件流或json数据原创 2021-12-14 15:12:08 · 4010 阅读 · 0 评论 -
Echarts饼图实现与引导线间的间隔
目标效果(连接线与饼图存在间隔):Echarts饼图label配置为outside时,默认连接线与图形直接相连:实现方案:绘制时,同时绘制两个半径不同的饼图。一个只显示饼图(半径较小),不显示label;另一个饼图(半径较大),设置为透明,只显示label和连接线。Echarts series的配置:option.series = [ // 只显示饼图,不显示label和连接线 { type: 'pie', startAngle: 180, minAngle: 15, rad原创 2020-12-18 15:05:59 · 3990 阅读 · 2 评论 -
JQ实现Ant Design 全局提示message效果
效果:js代码:/** 操作提示框: 成功、失败、提示* imgSrc: 对应图片* message: 提示文本* $parent: 父级容器* css: 样式*/function message(imgSrc, message, $parent, css) { var $exTips = $('<div class="exTips autoHide">' + '<img src="' + imgSrc + '" class="tipImg"&g原创 2020-07-18 15:25:00 · 1117 阅读 · 0 评论 -
JQ借鉴实现Ant Design loading效果
新老项目统一,但是旧的项目无法引入ant-design,所以封装与ant-design loading样式一致的方法。js代码: /** * 数据loading加载效果 * @param: {[string]} container [加载loading的容器,如".box","#box"] * @param: {[string]} display [show:显示loading,hide隐藏loading] * @param: {[number]} top原创 2020-07-18 14:53:40 · 480 阅读 · 0 评论 -
js判断多个时间段是否重叠(非嵌套循环)
考虑到性能问题,未采用嵌套循环判断的方式。主要思想是:对每组时间进行标记,然后转换为时间戳后排序,排序后的数组,步长为2循环,如果每两个的标记不同,或者存在相同时间,则说明重叠。// 预计时段数组const data = [{ startTime: new Date("2020-6-15 00:12:00), endTime: new Date("2020-6-15 09:12:00),}, { startTime: new Date("2020-6-15 06:12:00), endTime原创 2020-06-15 19:44:45 · 3098 阅读 · 4 评论 -
JS解析判断表达式(AST方式)
项目中需要解析表达式,如 ( A > ( B ) ) || (C > (D + E * F - 2) ) 。 公式存在一定规则: 为了确保公式的正确性,在生成公式中每一项时会使用括号进行包裹,如( A > ( B ) ) 和 (C > (D + E * F - 2) ), 同样内部比较符的右侧公式也会进行包裹如: ( B ) 、 (D + E * F - 2) 。 并且公式中条件全为||或者全为&&。第一想到的是抽象语法树(AST),使用到的类库:esprima,原创 2020-06-06 16:59:20 · 2732 阅读 · 0 评论 -
js实现从服务端获取word并预览
word转为html依赖mammoth.js(缺点是只能保留基础样式,word的复杂样式会丢失。复杂文件还是交给接口处理比较好)预览本地文件Demo: https://jstool.gitlab.io/zh-cn/demo/preview-ms-word-docx-document-in-browser从服务端获取word并实现预览: function preView(url) { var _this = this; var xhr = new XMLHttpRequest() xhr.o原创 2020-05-11 09:24:55 · 1486 阅读 · 0 评论 -
Css实现带阴影的箭头框
通过html + css实现带阴影的三角箭头框,如下:html<div id="tips"></div>css#tips{ position: relative; width: 165px; background-color: #FFFFFF; box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, ...原创 2019-12-09 20:39:48 · 1602 阅读 · 0 评论 -
父级页面监听iframe点击事件
通过contentDocument属性定义和用法:contentDocument 属性以 HTML 对象返回框架容纳的文档。语法:frameObject.contentDocumenthtml:<iframe id="iframe" frameborder=0 scrolling="no"></iframe>父级页面js:document.getEleme...原创 2019-12-09 16:21:59 · 5417 阅读 · 0 评论