js | 易学教程

JS前端下载文本文件小技巧：1、download属性；2、借助Blob转换成二进制下载

阅读更多关于 JS前端下载文本文件小技巧：1、download属性；2、借助Blob转换成二进制下载

一、HTML download 与文件下载　　如果希望在前端侧直接触发某些资源的下载，最方便快捷的方法就是使用HTML5原生的 download 属性，例如： <a href="large.jpg" download>下载</a> 　　但显然，如果纯粹利用HTML属性来实现文件的下载（而不是浏览器打开或浏览），对于动态内容，就无能为力。　　例如，我们对页面进行分享的时候，希望分享图片是页面内容的实时截图，此时，这个图片就是动态的，纯HTML显然是无法满足我们的需求的，借助JS和其它一些HTML5特性，例如，将页面元素转换到 canvas 上，然后再转成图片进行下载。　　是否支持download属性的监测：要监测当前浏览器是否支持 download 属性，一行JS代码就可以了，如下： var isSupportDownload = 'download' in document.createElement('a'); 二、借助HTML5 Blob实现文本信息文件下载　　原理其实很简单，我们可以将文本或者JS字符串信息借助Blob转换成二进制，然后，作为 <a> 元素的 href 属性，配合 download 属性，实现下载。　　代码也比较简单，如下示意（兼容Chrome和Firefox）： var funDownload = function (content,

C#写COM组件，JS调用控件

阅读更多关于 C#写COM组件，JS调用控件

1、c#2005中新建项目，类型为类库，项目名为AddCom确定。　　配置：右键点击解决方案资源管理器中的AddCom，选择“属性”，选择“生成”，选择“为COM Interop注册(_P)” 2、打开AssemblyInfo.cs文件，设置[assembly: ComVisible(true)]，如果不改则不能被其他程序调用 3、编写com组件会用到guid(全球唯一ID)，编写com组件必须要用到。c#会默认生成一个放在AssemblyInfo.cs，如没有生成，网上下一个生成guid的软件，有很多呢。 4、c#中源代码如下，按如下方法编写代码后生成工程，/bin/release中得到AddCom.dll。 using System; using System.Collections.Generic; using System.Text; using System.Runtime.InteropServices; namespace AddCom { [Guid("298D881C-E2A3-4638-B872-73EADE25511C")] public interface AddComInterface { [DispId(1)] int iadd(int a, int b); } [Guid("2C5B7580-4038-4d90-BABD-8B83FCE5A467")

JS练习篇2

阅读更多关于 JS练习篇2

1. 用 var 定义的变量，在二次声明却未赋值时，该变量的值还是第一个定义的值 var a = 3 ; var a ; console . log ( a ) ; //3 2. valueOf 方法的使用 undefined 和 null 没有 valueOf 方法，使用会报错。布尔类型会返回原值： true/false 字符串类型会返回原值数字： ① 如果是整数，则需要用小括号将数字包起来再使用 valueOf 方法，直接在数字后面跟 valeuOf 会报错。 ② 如果是小数，可以直接调用 valueOf 方法对象 Object 类型及自定义对象类型会返回源对象（注意花括号可能会被当做代码块的问题）函数 function 类型会返回原函数数组 Array 类型返回原数组 Date 对象类型返回数字（1970年1月1日00：00：00至现在的毫秒数）；正则表达式类型返回正则对象。 //在做加法时，在对象被强制转换成数字时会调用其valueOf方法 let i = 1 + { valueOf ( ) { return 9 ; } } 3. forEach 、 map 方法的执行是会跳过非有效值(即未初始化的值，如果直接给一个元素设置为 null 和 undfined ，其仍被视为有效值) let arr = new Array ( 10 ) ; let i = 0

js和jq实现轮播图

阅读更多关于 js和jq实现轮播图

一.js实现 <!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> <style> *{ padding:0; margin:0; box-sizing: border-box; } ul{ list-style: none; } .swiper-wrap{ position:relative; width:500px; margin: 30px auto; } #swiper-ul{ position:relative; width:100%; height:186px; } li{ position: absolute; top:0; width: 100%; opacity: 0; transition: all .5s; } li img{ display: block; width:100%; } li.active{ z-index:100; opacity: 1; transition: all .5s;

JS 时间格式转换为时间戳

阅读更多关于 JS 时间格式转换为时间戳

　　　　　var startDayArr = document.getElementById("Date1").value.split("-"); var endDayArr = document.getElementById("Date2").value.split("-"); document.getElementById("start").value = Date.UTC(startDayArr[0],(startDayArr[1]-1),startDayArr[2],0,0,0)/1000; //将当前时间转换成时间搓; document.getElementById("end").value = Date.UTC(endDayArr[0],(endDayArr[1]-1),endDayArr[2],0,0,0)/1000; //将当前时间转换成时间搓; 如 2013-12-12 转换为时间戳其他格式类似。时间戳转换任何自己想要的日期格式： function formatDate(now) { var year=now.getYear(); var month=now.getMonth()+1; var date=now.getDate(); var hour=now.getHours(); var minute=now.getMinutes(); var second

[转] JS中的call()方法和apply()方法用法总结

阅读更多关于 [转] JS中的call()方法和apply()方法用法总结

//例1 <script> window.color = 'red'; document.color = 'yellow'; var s1 = {color: 'blue' }; function changeColor(){ console.log(this.color); } changeColor.call(); //red (默认传递参数) changeColor.call(window); //red changeColor.call(document); //yellow changeColor.call(this); //red changeColor.call(s1); //blue </script> //例2 var Pet = { words : '...', speak : function (say) { console.log(say + ''+ this.words) } } Pet.speak('Speak'); // 结果：Speak... var Dog = { words:'Wang' } //将this的指向改变成了Dog Pet.speak.call(Dog, 'Speak'); //结果： SpeakWang //例1 <script> window.number = 'one'; document.number = 'two'; var

js系列5-内置对象

阅读更多关于 js系列5-内置对象

1.概述内置对象是js自带的一些对象，供开发者使用。内置对象有很多，这里是不可能全部讲完的。但是有一个权威网站可供大家使用：MDN。网址是：https://developer.mozilla.org/zh-CN/ 2.数学对象这里是一些常用的数学对象： console . log ( Math . PI ) ; //圆周率派 console . log ( Math . max ( 1 , 2 , 3 , 4 ) ) //求最大值,如果有不是数字的元素，则返回NaN console . log ( Math . floor ( 1.3 ) ) //往小取值 console . log ( Math . ceil ( 1.6 ) ) //往大取值 console . log ( Math . round ( 1.4 ) ) //四舍五入 console . log ( Math . random ( ) ) //返回一个区间在[0，1）之间的小数，扩展去MDN查阅 3.日期对象Date（） 3.1 Date是一个日期对象。是一个构造函数。必须使用new来调用。 var date==new Date();//如果没有参数，返回当前系统的当前时间。 //参数常用方法 var date1 = new Date ( 2019 , 10 , 1 ) ; var date2 =

js 排序：sort()方法、冒泡排序、二分法排序。

阅读更多关于 js 排序：sort()方法、冒泡排序、二分法排序。

js中的排序，这里介绍三种，sort()方法、冒泡排序、二分法排序。 1、sort方法写法: 数组.sort(); 返回排好序的数组，如果数组里是数字，则由小到大，如果是字符串，就按照第一个字符的字符编码大小排序。写法2: 数组.sort(function(a,b){ return a-b }); 表示从大到小，（如果写 retrun b-a 则由大到小排序）；不详细解释了。 2、冒泡排序。原理是，直接将原理可能不好懂，我们还是按照下面的方法去讲吧，这样容易懂些。 //冒泡排序function quickSort(arr){ for(var i=0; i<arr.length-1; i++){ console.log(i); for(var j=0; j<arr.length-i-1; j++){ if(arr[j] > arr[j+1]){ var oldVal = arr[j]; arr[j] = arr[j+1]; arr[j+1] = oldVal; } } } } 我们假设要排序的数组是arr = [10, 8, 7, 6]; 原理：这里arr长为3，外层循环三次，当外层for循环第一次循环的时候，即i=0的时候，进入里层循环，这时候将arr循环3次（4-0-1 = 3），即将arr的第一个数挨个于后面三个数比较，如果它大于后面的某个数，就与其交换位置

对js构造函数,原型对象和原型的理解(3)

阅读更多关于对js构造函数,原型对象和原型的理解(3)

探究constructor 不知道大家发现了没有啊在我们的对象原型__proto__和构造函数的原型对象prototype身上都有一个constructor属性这个constructor它指回的是我们构造函数的本身不知道大家有没有想过啊,如果我只有一个方法,那我就直接放到构造函数的原型对象身上了是吧,那我这样写,当然我zs的这个实例可以访问到sing方法了. function Star ( name , age ) { this . name = name ; this . age = age ; } Star . prototype . sing = function ( ) { console . log ( '我会唱歌' ) ; } var zs = new Star ( '张山' , 10 ) ; 那如果我有多个需要共享的方法,我那是不是得这样写了 function Star ( name , age ) { this . name = name ; this . age = age ; } Star . prototype . sing = function ( ) { console . log ( '我会唱歌' ) ; } Star . prototype . jump = function ( ) { console . log ( '我会跳' ) ; }

JS-小球碰撞反弹

阅读更多关于 JS-小球碰撞反弹

类似于屏保的一种动画，当小球碰到边框时，发生反弹，并且变化颜色。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>碰壁反弹</title> <style type="text/css"> #wrap{ width: 400px;height: 500px; border: 1px solid green; margin: 100px auto 0px; position: relative; } #ball{ width: 50px;height: 50px; background: black; border-radius: 50%; position: absolute; left: 0;top: 0; } #pall{ width: 50px;height: 50px; background: blue; border-radius: 50%; position: absolute; right: 0;top: 0; } </style> </head> <body> <div id="wrap"> <div id="ball"></div> <div id="pall"></div> </div> <script type="text/javascript"> var ball =

订阅 js