目录 HTTP劫持、DNS劫持与XSS HTTP劫持 DNS劫持 XSS跨站脚本 页面被嵌入iframe中，重定向iframe 使用白名单放行正常iframe嵌套 更改URL参数绕过运营商标记 内联事件及内联脚本拦截 浏览器事件...

1. 前言 最近在学习 Webpack 相关的原理，以前只知道 Webpack 的配置方法，但并不知道其内部流程，经过一轮的学习，感觉获益良多，为了巩固学习的内容，我决定尝试自己动手写一个插件...

目录 流畅动画的标准 法一：借助 Chrome 开发者工具 法二：借助 Frame Timing API Blink 内核早期架构 JS 动画与 CSS 动画的细微区别 什么是 Frame Timing API ？ Frame Timing API 示意 法三：借助 requ...

微信小程序组件设计规范 组件化开发的思想贯穿着我开发设计过程的始终。在过去很长一段时间里，我都受益于这种思想。 组件可复用 - 减少了重复代码量 组件做为抽离的功能单元...

1.使用 app.json创建页面 按照我们平常的开发习惯，创建一个新的页面，一般都会先创建文件夹，再创建对应page的形式，创建完成后，app.json中会自动注册该页面。实际上，我们还可以通...

这篇文章我会以我自己开发经验从如下几个角度来讲解相关的内容 页面如何向组件传数据 组件如何向页面传数据 页面如何调用组件内的函数 组件如何调用页面内的函数 1.页面如何向组...

本文实例为大家分享了微信小程序实现贪吃蛇游戏的具体代码，供大家参考，具体内容如下 一、项目截图 二、源代码 1.WXML 代码如下（示例）： view class='container' view class='content-bottom...

结合自己在平时的开发中遇到的各种问题，和浏览各种问题的解决方案总结出一些自己在日常开发中常用的技巧和知点,希望各位不吝斧正。 1.短生命周期数据存储 以小程序启动到彻底...

目录 什么是代理模式 引入一个现实生活中的案例 结合案例理解代理模式的定义 什么是Proxy get(target, propKey, receiver) set(target, propKey, value, receiver) 总结 什么是代理模式 引入一个现实生活...

目录 数组的解构赋值 对象的解构赋值 解构赋值的运用 交换变量的值 从函数返回多个值 遍历Map结构 函数参数的解构赋值 数组的解构赋值 let [a, b, c] = [1, 2, 3] 同时定义多个变量，a匹配...

一、为什么要写这个文章？ 处理重复请求的文章想必大家也看过了很多，大多数都是分为在response返回之前发现重复请求就return掉的和使用节流/防抖来间接规避用户频繁操作两种版本的...

本文实例为大家分享了小程序实现筛子抽奖的具体代码，供大家参考，具体内容如下 效果图 !--pages/shaizi/index.wxml--view class="container" view class="shaizi_box {{activeTrue}}" style="transform: rotateX({{...

本文实例为大家分享了小程序实现分页效果展示的具体代码，供大家参考，具体内容如下 view class="pages_box" view bindtap="pagesFn" class="{{pagesNum==0'active':''}}" data-type="0"上一页/view block wx:for=...

本文实例为大家分享了微信小程序实现摇筛子效果的具体代码，供大家参考，具体内容如下 1.效果图： 2.HTML代码： !--pages/game/game.wxml--view class="text"筛子点数为：{{total}}/viewview class="po...

本文实例为大家分享了微信小程序实现摇骰子游戏的具体代码，供大家参考，具体内容如下 页面代码 view class='top'{{txt}}/viewview class='point1' image src='{{one_img}}'/image/viewview class='point2' imag...

本文实例为大家分享了JavaScript实现异步提交表单数据的具体代码，供大家参考，具体内容如下 效果如下： 首先看一下HTML代码部分： div class="container" form class="form-horizontal" onsubmit="ret...

本文实例为大家分享了JavaScript实现异步获取表单数据的具体代码，供大家参考，具体内容如下 在上一篇文章中讲到了使用JavaScript异步提交表单中的数据，那么今天我们就讲讲利用Jav...

一、数据从QT流向JS 1、QT调用JS的函数，JS通过形参获得QT的值 2、JS调用QT的函数，QT函数的返回值进入JS 二、数据从JS流向QT 1、JS调用QT的函数，QT通过形参获得JS的值 2、QT调用JS的函数，...

目录 问题 分析 解决 替换 Alert() 函数 setTimeOut函数 小结 问题 前几天使用 JavaScript 写 HTML 页面时遇到了一个奇怪的问题： 我想实现的功能是通过 confirm() 弹窗让用户选择不同的需求，每...

本文实例为大家分享了JS实现打砖块弹球小游戏的具体代码，供大家参考，具体内容如下 使用原生JS写的，还有一点瑕疵。代码直接复制到html就能使用 速度随机的 因为设涉及横向和纵...

目录 1、引入文件 2、html页面 3、主要代码 4、优化图片转base64的流程，提高zip的打包速度 5、再优化，通过axios把图片转成base64 1、引入文件 script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6...

目录 Show Me The Code 测试下效果 效果 PS 另一种方法 Show Me The Code HTMLElement.prototype.appendHTML = function(html) {let divTemp = document.createElement("div");let nodes = null;let fragment = document.createDocumentFragmen...

背景 接口域名没有写死，而是动态获取。具体实现就是 通过读取一个静态json文件，来设置真实的接口域名。好处是原域名有可能被封，这样可以直接后台操作修改该配置文件即可；不...

前言 本文记录一下自己手动实现的一个前端常见的短信验证码输入组件，从需求到实现逐步优化的过程。 正文 1.需求分析 首先看一下效果图。 首先页面加载的时候，输入框获取焦点，...

目录 一、Why Redux 二、Redux Data flow 三、Three Principles（三大原则） 四、Redux源码解析 4.1、index.js 4.2、createStore.js 4.3、combineReducers.js 4.4、bindActionCreators.js 4.5、compose.js 4.6、applyMiddleware.js...

目录 前言 1. 拆分字符串 2. JSON格式化和解析 3. 多行字符串和嵌入式表达式 4. 验证字符串数组中是否存在子字符串 总结 前言 字符串是编程世界最基本最重要的数据类型之一，JavaScrip...

大家好，我是秋风，近日，微信又发布了新功能（更新到微信8.0.6）。最火热的非"炸屎"功能莫属了，各种群里纷纷玩起了炸屎的功能。 不知道大家是否经历过那样一个时候，小时候（...

最近关注区块链方面的信息, 瞎转悠, 偶然看到这个网站首页的效果. 一堆浮动的球, 球在距离较近的时候会有感应线连接, 鼠标也可以和球产生感应线. 看了下是用canvas做的. 原效果 实现...

天正在等烟雨，而我在等你，啦啦啦，欢迎关注我的简书，今天分享的是原创的canvas仿写贝塞尔曲线方法。具体如下： 效果图： html canvas id=mycanvas width=500 height=500您的浏览器不支持ca...

本文介绍了canvas 阴影和图形变换的示例代码，分享给大家，具体如下： 一、阴影设置 1、阴影的颜色：值为标准的CSS颜色值，用于设定阴影颜色效果，默认是全透明的黑色 context.shado...

响应式设计 所谓的响应式设计，是指在不同的屏幕分辨率，不同的像素密度比，不同宽度的终端设备中，网页布局可以自适应的调整。响应式设计的本意是使原本PC上的网站兼容移动终...

为一个视频添加一个覆盖物，从而挡住视频某区域，在视频的某一时间段，比如第10到第20分钟不显示划定的这块区域。应用场景包括 遮挡卫视图标 、 遮挡视频右下角广告 、 充当马赛...

Web Worker是HTML5提供的一个javascript多线程解决方案，我们可以将一些大计算量的代码交由web Worker运行而不冻结用户界面。 一：如何使用Worker Web Worker的基本原理就是在当前javascript的主线...

今天开始我们就从最基础解析如何构建 HTML5 Canvas 拓扑图应用，HT 内部封装了一个拓扑图形组件 ht.graph.GraphView（以下简称 GraphView）是 HT 框架中 2D 功能最丰富的组件，其相关类库都在...

常见的, 物体/图片做抛物线或者更准确的说是沿贝塞尔曲线运动是H5开发中常见的需求, 那么如何快速的根据设计稿计算出运动路径是开发者首要解决的问题. 我这边H5开发常用的设计稿...

当我们的app开发完成之后，无可避免的以后会进行产品升级，那么我们希望在客户的手机上让app进行自动升级，可以分为自动升级和手动升级。 自动升级：一般在客户app第一次打开首页...

写在最前 由于原生的Canvas最高只支持到三阶贝塞尔曲线，那么我想添加多个控制点怎么办呢？（即便大部分复杂曲线都可以用3阶贝塞尔来模拟）与此同时【文章源自：ddos攻击防御 复制...

写在最前 本次分享一下在canvas中将绘制出来的折线段的棱角磨平，也就是通过贝塞尔曲线穿过各个描点来代替原有的折线图。 为什么要平滑拟合折线段 先来看下Echarts下折线图的渲染效...

写在最前 在之前的这篇文章中我们提到了对于贝塞尔公式的运用。本次分享一下如何推导贝塞尔公式以及附一个简单的即小球跟随曲线轨迹运动。 效果预览 demo地址 对于如何绘制连续...

在介绍HTML5 web缓存前，来认识一下cookie和session： session： 由于HTTP是无状态的，你是谁？你干了什么？抱歉服务器都是不知道的。 因此session（会话）出现了，它会在服务器上存储用户信...

因为canvas的api没有虚线的 所以需要自己实现 顺便复习一下三角函数岂不美滋滋 var context=document.getElementById(canvas).getContext(2d);function drawDashedLine(context,x1,y1,x2,y2,dashlength){ da【本文由：香港...

本文介绍了canvas 微信海报分享，分享给大家，具体如下： 随机产生一张图片 拿到微信用户的头像和称呢（自己调后端的接口获取） 把用户头像和称呢和随机产生一张图片合成一张海报...

rem 布局适配方案 主要方法为： 按照设计稿与设备宽度的比例，动态计算并设置 html 根标签的 font-size 大小； css 中，设计稿元素的宽、高、相对位置等取值，按照同等比例换算为 rem 为...

众所周知canvas是位图，你可以在里面渲染你要的东西，不过你只能操作canvas的属性来进行编辑。就是说你并不能操作画进canvas的东西，例如我在canvas里添加一幅画，我现在想将那幅画移...

本文介绍了html5 video 移动端填坑记，分享给大家，具体如下： video id=video style=object-fit:fill autoplay webkit-playsinline playsinline x5-video-player-type=h5 x5-video-player-fullscreen=true x5-video-orientation=port...

一、概念 1、PC端和移动端有什么区别 从我个人角度来说，我觉得PC端的定位就是用户视觉浏览路线，可以显示较多的内容，而移动互联网终端的定位就是便携，体现的是Anyone Anytime An...

在大家查看HTML时，经常会看到data-role、data-theme等的使用，比如：通过如下代码即可实现页眉的效果： div data-role=header h1我是标题/h1 /div 为什么写一个 data-role=header 就能实现底部为黑色...

本文介绍了html5 shiv.js和respond.min.js，分享给大家，具体如下： 做页面常用的东西，写这里用的时候省点去找了。。。 html5shiv：解决ie9以下浏览器对html5新增标签的不识别，并导致CSS不起...

在jQuery的attr与prop提到过在IE9之前版本中如果使用property不当会造成内存泄露问题，而且关于Attribute和Property的区别也让人十分头痛，在HTML5中添加了data-*的方式来自定义属性，所谓data...

这几天使用H5开发了一个仿微信聊天前端界面，尤其微信底部编辑器那块处理的很好，使用HTML5来开发，虽说功能效果并没有微信那么全，但是也相当不错了，可以发送消息、表情，发送...