高效处理报表，掌握原生JS打印和导出报表为PDF的顺畅技巧！

【高效处理报表，掌握原生JS打印和导出报表为PDF的顺畅技巧！】的更多相关文章

通过原生JS打印一个空心菱形图案

<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> </head> <body> </body> </html> <script> // 打印一个空心菱形图案 for(var i = 1; i <=6 ; i++){ for(var k = 1 ; k&l…

最近在做关于文件下载的需求:前端调用接口,然后对返回数据进行过滤.格式化,然后按表格内容拼接生成csv文件,让用户下载. 具体实现方式如下:let sourceData = { head: [ '时间', '成交价格', '成交数量', '手续费', '成交金额', ], data: [ {time: '2019-10-17 14:54:52', tradePrice: '30.0022.001.32 TWD', fee:'0 TWD', tradeAmount: '660.00',}, {ti…

React.js实现原生js拖拽效果及思考

一.起因&思路不知不觉,已经好几天没写博客了...近来除了研究React,还做了公司官网... 一直想写一个原生js拖拽效果,又加上近来学react学得比较嗨.所以就用react来实现这个拖拽效果. 首先,其实拖拽效果的思路是很简单的.主要就是三个步骤: 1.onmousedown的时候,启动可拖拽事件,记录被拖拽元素的原始坐标参数. 2.onmousemove的时候,实时记录鼠标移动的距离,结合被拖拽元素第一阶段的坐标参数,计算并设置新的坐标值. 3.onmouseup的时候,关闭可拖拽事件…

使用原生JS实现一个风箱式的demo，并封装了一个运动框架

声明,该DEMO依托于某个培训机构中,非常感谢这个培训结构.话不多说,现在开始改demo的制作. 首先,在前端的学习过程中,轮播图是我们一定要学习的,所以为了更加高效的实现各种轮播图,封装了一个运动的框架. function getStyle(obj,attr) { if(obj.currentStyle){ return obj.currentStyle[attr];//为了获取IE下的属性值 }else{ return window.getComputedStyle(obj,null)[at…

用原生JS读写CSS样式的方法总结

为了日后方便查询,本人翻阅了一些资料总结了以下方法,仅限原生JS,如有不对的地方欢迎指出!只求大家看完觉得有学到点什么就OK了! 一.可以通过DOM节点对象的style对象(即CSSStyleDeclaration对象)来读写文档元素的CSS样式如:var elm = document.getElementById('test'); elm.style.color = 'black'; 二.通过Element对象的g…

原生Js 两种方法实现页面关键字高亮显示

原生Js 两种方法实现页面关键字高亮显示上网看了看别人写的,不是兼容问题就是代码繁琐,自己琢磨了一下用两种方法都可以实现,各有利弊. 方法一依靠正则表达式修改 1.获取obj的html2.统一替换html标签3.替换要修改的关键字4.再把html标签修改回去不足就是如果查找的关键字跟替换的标签一样就有冲突了效果预览:http://jsfiddle.net/dtdxrk/EAqkN/embedded/result/ 1 <!DOCTYPE HTML> 2 <html lang=&qu…

原生JS实现百度搜索功能

今天呢给大家分享一下自己用原生JS做的一个百度搜索功能,下面上代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8">  <link rel="shortcut icon" href="https://www.baidu.com/favicon.ico" type="image/x-ic…

用原生JS从零到一实现Redux架构

前言最近利用业余时间阅读了胡子大哈写的<React小书>,从基本的原理讲解了React,Redux等等受益颇丰.眼过千遍不如手写一遍,跟着作者的思路以及参考代码可以实现基本的Demo,下面根据自己的理解和参考一些资料,用原生JS从零开始实现一个Redux架构. 一.Redux基本概念经常用React开发的朋友可能很熟悉Redux,React-Redux,这里告诉大家的是,Redux和React-Redux并不是一个东西,Redux是一种架构模式,2015年,Redux出现,将 Flux 与…

页面性能优化-原生JS实现图片懒加载

在项目开发中,我们往往会遇到一个页面需要加载很多图片的情况.我们可以一次性加载全部的图片,但是考虑到用户有可能只浏览部分图片.所以我们需要对图片加载进行优化,只加载浏览器窗口内的图片,当用户滚动时,再加载更多的图片.这种加载图片的方式叫做图片懒加载,又叫做按需加载或图片的延时加载.这样做的好处是:1.可以加快页面首屏渲染的速度:2.节约用户的流量. 一.实现思路 1.图片img标签自定义一个属性data-src来存放真实的地址. 2.当滚动页面时,检查所有的img标签,判断是否出现在事业中,如果…

原生js实现双向数据绑定

一.两个model之间的双向绑定 var o = { a: 0 } o.b = o.a + 1; console.log(o.a); // "0" console.log(o.b); // "1" //更新o.a o.a = 5; o.b = o.a + 1; console.log(o.a); // "5" console.log(o.b); // "6" //更新o.b o.b = 10; o.a = o.b / 5; o…