分类：JS

2020
09-28

JS浏览器BOM常见操作实例详解

本文实例讲述了JS浏览器BOM常见操作。分享给大家供大家参考，具体如下：window尺寸有三种方法能够确定浏览器窗口的尺寸（浏览器的视口，不包括工具栏和滚动条）。对于InternetExplorer、Chrome、Firefox、Opera以及Safari：window.innerHeight-浏览器窗口的内部高度window.innerWidth-浏览器窗口的内部宽度对于InternetExplorer8、7、6、5：document.documentElement.clientHeightdocument.documentElement.clien... 继续阅读 >
2020
09-28

js HTML DOM EventListener功能与用法实例分析

js HTML DOM EventListener功能与用法实例分析 本文实例讲述了jsHTMLDOMEventListener功能与用法。分享给大家供大家参考，具体如下：DOMEventListener用于向指定元素添加事件句柄。在用户点击按钮时触发监听事件：document.getElementById('myBtn').addEventListener('click',displayDate);addEventListener()方法添加的事件句柄不会覆盖已存在的事件句柄。可以向一个元素添加多个事件句柄。<script>varx=document.getElementById("myBtn");x.addEventListener("mouseo... 继续阅读 >
2020
09-28

JS严格模式原理与用法实例分析

本文实例讲述了JS严格模式原理与用法。分享给大家供大家参考，具体如下：使用"usestrict"指令"usestrict"指令在JavaScript1.8.5(ECMAScript5)中新增。它不是一条语句，但是是一个字面量表达式，在JavaScript旧版本中会被忽略。支持严格模式的浏览器:InternetExplorer10+、Firefox 4+Chrome 13+、Safari5.1+、Opera12+。严格模式声明严格模式通过在脚本或函数的头部添加"usestrict";表达式来声... 继续阅读 >
2020
09-27

分享一款超好用的JavaScript 打包压缩工具

分享一款超好用的JavaScript 打包压缩工具 背景平时大家在开发Js项目的时候，可能已经离不开webpack等打包工具了。而webpack打包速度大概就是“能用“的水平。大概去年开始，我就开始在构想，如果能写一个极速的打包工具，功能未必需要很强，可能对小项目非常有用。去年我用C++写完parser之后，便没什么动力写下去了。但是最近发现有这个想法的不止我一个，Figma的CTO业余之际写了一个打包器https://github.com/evanw/esbuild，可以说完完全全实现了我想象中... 继续阅读 >
2020
09-27

利用原生JS实现欢乐水果机小游戏

利用原生JS实现欢乐水果机小游戏 简介：玩家点击某个押注物品则在该物品上下注。点击开始则游戏开始，如果没有下注则不能开始游戏。游戏中的物品有八中，分别为：苹果、西瓜、柠檬、橙子、铃铛、77、双星、BAR。在放行游戏区左右方为押注区，每种物品下方有加减号按钮，每次点击加号增加一个筹码注金，反之减号就减少一个筹码注金开始：开始键奖励：GOODLUCK由于这个时低配版的，我就没有按照原版的写进去，就是中了GOODLUCK直接获得15分。出于好耍，本人想起了... 继续阅读 >
2020
09-27

JS eval代码快速解密实例解析

有一段js代码内容如下：eval(function(E,I,A,D,J,K,L,H){functionC(A)后面内容省略。。。解密可以采用如下方法：方法一：打开谷歌浏览器，按F12，在Console窗口中把eval代码复制粘贴进去，回车运行，即可就到源码。方法二：新建一个html文件，把上面eval替换成document.write输出即可。备注，前后加xmp标签的作用是完整的输出html标签，并且不做任何转义。<html><head><title>eval解密</title></head><body><scripttype="text/ja... 继续阅读 >
2020
09-27

JS脚本实现定时到网站上签到/签退功能

之前介绍过使用temperMonkey屏蔽CSDN广告的方法，主要就是要针对性地分析网站结构，然后用代码去改变或者操作DOM。今天也一样，我们需要观察网页结构，找到我们要操作的按钮，触发他的click事件就可以了。下面以公司打卡签到的网站为例，做一些坏坏的事情。本文读者最好有一定的HTML和JavaScript基础。首先，想象一下你去签到需要做什么：打开网站登陆点击“签到”按钮然后每一步我们都可以让代码帮我们去做。0.如何定时这... 继续阅读 >
2020
09-27

Iconfont(矢量图标)+iconmoon(图标svg互转)配合javascript实现社交分享系统

Iconfont(矢量图标)+iconmoon(图标svg互转)配合javascript实现社交分享系统 每一个应用程序，其实都会有分享的需求，比如一键分享一篇文章或者一些活动到微博或者微信亦或者是twitter等社交平台，因为人类是社交动物，而社交分享能够满足马斯洛需求金字塔情感和归属的需求以及受尊重的需求。另外网页的社交分享功能不仅可以满足阅读者，同时，对于网络应用本身，也可以相应的增加该网站的外部链接，比如微博豆瓣等线上粘性用户非常多的社交平台，如果是twitter或者facebook则可以带来一部分来自于国外的流量... 继续阅读 >
2020
09-27

深入浅析JavaScript中的in关键字和for-in循环

1.in关键字属性名in对象，用来判断某个属性在对象中是否存在与其严格相等的属性名，返回boolean值属性名必须是字符串或数字varobj={a:1,b:2}console.log('a'inobj);//返回true，obj对象中存在a属性名vararr=[12,11,10];console.log(12inarr);//返回false，原因arr数组中12,11,10三个值对应的属性名分别是0,1,22.for-in循环for(varpropinobj){//循环语句}取出对象的所有属性名，每次循环将其中一个... 继续阅读 >
2020
09-27

JS实现横向跑马灯效果代码

首先我们需要一个html代码的框架如下：<divstyle="position:absolute;top:0px;left:168px;width:100%;margin-left:auto;margin-right:auto;height:47px;border:0pxsolidred;overflow:hidden;"><ulid="syNoticeUlNew"style="margin:0px;left:0;top:0;margin-bottom:0px;width:100%;height:47px;position:absolute;"></ul></div>我们的目的是实现ul中的内容进行横向的一点一点滚动。ul中的内容应... 继续阅读 >
2020
09-27

基于js判断浏览器是否支持webGL

起因是我之前开发的网页，用到了three.js制作了一个3d的旋转球体效果。在各种浏览器上运行都没问题，在IE上也做了兼容代码。但是今天接电话，老板说你这网页在xp上不显示啊。IE上好使。google浏览器不好使。于是开始解决问题，不禁陷入了沉思。what?网页显示难道还与操作系统有关？google竟然不好使？于是搭建一个xp虚拟机。于是下载一个chorme。惊奇的发现并不能安装最新版本的chrome。哦？一定是xp上安装的低版本chrome而那... 继续阅读 >
2020
09-27

原生js实现的观察者和订阅者模式简单示例

本文实例讲述了原生js实现的观察者和订阅者模式。分享给大家供大家参考，具体如下：观察者模式也叫发布者-订阅者模式，发布者发布事件，订阅者监听事件并做出反应在传统的前端解耦方面，观察者模式作为比较常见一种设计模式，大量使用在各种框架类库的设计当中。核心代码：//eventProxy.js'usestrict';consteventProxy={onObj:{},oneObj:{},on:function(key,fn){if(this.onObj[key]===undefined){this.onObj... 继续阅读 >
2020
09-27

javascript canvas检测小球碰撞

本文实例为大家分享了javascriptcanvas实现检测小球碰撞的具体代码，供大家参考，具体内容如下定义一个canvas标签<divclass="cnavasInfo"><canvasid="canvas"width="800"height="500"></canvas></div>函数以及相关的逻辑处理exportdefault{data(){return{canvas:null,ctx:null,arcObj:{}};},mounted(){this.canvas=document.getElementById("canvas");this.ctx=this.canvas.getContext(... 继续阅读 >
2020
09-27

JS实现表单中点击小眼睛显示隐藏密码框中的密码

JS实现表单中点击小眼睛显示隐藏密码框中的密码 领导交个一个任务，要求在表单中点击小眼睛显示隐藏密码框中的密码！在一些网站中经常会用到这样的功能，今天小编就给大家分享我的实现思路及代码准备：1.两张png图片，一张睁眼，一张闭眼，可以到阿里巴巴矢量图库寻找（免费下载）最终效果图css样式部分，样式可根据自己喜好设置，没有过硬要求<style>div:first-child{width:300px;height:50px;background-color:red;color:white;margin:... 继续阅读 >