自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

原创 JavaScript实现简单计算器(加减乘除)

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport"...

2020-02-24 13:12:07

阅读数 1

评论数 0

原创 JavaScript实现数字时钟

利用定时器实现数字时钟 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="vi...

2020-02-24 13:09:17

阅读数 2

评论数 0

原创 几种Tab面板实现方法

CSS实现Tab面板 不能自行切换 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name=&q...

2020-02-23 14:16:55

阅读数 10

评论数 0

原创 响应式网页设计

什么是响应式网页? 响应式网页的核心思想:“一次设计,普遍适用” 不管使用什么设备,打开及显示的都是同一个地址、同一个网页,布局及显示适应不同的浏览环境 媒体查询及应用 媒体查询(Media Query)是CSS 3 中获取用户行为和设备环境(比如屏幕宽度、屏幕分辨率、设备方向等)并适配相应的C...

2020-02-23 10:53:56

阅读数 12

评论数 0

原创 jQuery基础总结

jQuery入门 jQuery基础:初始jQuery jQuery元素操作 jQuery对象 jQuery选择器 元素遍历 jQueryDOM节点操作 jQuery事件操作 jQuery动画特效 jQuery操作Ajax jQuery插件机制

2020-02-20 12:49:19

阅读数 12

评论数 0

原创 jQuery操作Ajax

传统的Ajax是通过XMLHttpRequest实现的,不仅代码复杂,而且浏览器兼容问题也比较多。 jQuery中通过对Ajax操作的封装,极大地简化了Ajax操作的开发过程。 参数url表示待请求页面的URL地址。 data表示传递的参数。 参数fn表示请求成功时,执行的回调函数。 参数ty...

2020-02-19 22:00:15

阅读数 6

评论数 0

原创 jQuery基础:jQuery控制属性与类

控制属性attr jQuery可以对元素本身的属性进行操作,包括获取属性的属性值,设置属性的属性值,也可以删掉属性。 attr()和removeAttr()分别用于设置与删除属性 控制CSS类 jQuery可以对CSS类进行操作,包括addClass()添加类、removeClass()删除类、...

2020-02-19 15:56:52

阅读数 15

评论数 0

原创 jQuery基础:jQuery事件操作

jQuery常用事件 参数function表示触发事件时执行的处理程序(函数)。 参数data用于为事件处理函数传递数据。 (可在事件处理函数中使用“事件对象.data”获取) 页面加载事件 jQuery中的页面加载事件方法有3种语法形式,具体如下。 $(document).ready(fu...

2020-02-19 15:56:27

阅读数 9

评论数 0

原创 JavaScript 事件处理

事件处理 1、事件概述 事件处理程序:指的就是JavaScript为响应用户行为所执行的程序代码。 事件驱动式:是指在Web页面中JavaScript的事件,侦测到的用户行为,并执行相应的事件处理程序的过程。 事件流:事件发生时,会在发生事件的元素节点与DOM树根节点之间按照特定的顺序进行传播,这...

2020-02-19 14:53:19

阅读数 16

评论数 0

原创 JavaScript DOM

DOM节点

2020-02-18 16:53:20

阅读数 8

评论数 0

原创 JavaScript基础总结

JavaScript标识符定义规则 由大小写字母、数字、下划线和美元符号($)组成。 不能以数字开头。 严格区分大小写。 不能使用JavaScript中的关键字命名。 要尽量要做到“见其名知其意”。 JavaScript已保留关键字 JavaScript未保留关键字 JavaScript基本数...

2020-02-18 16:10:43

阅读数 15

评论数 0

原创 Vue基础:vue组件基础

基本示例 组件的复用 组件的组织 通过Prop向子组件传递数据 单个根元素 监听子组件事件 通过插槽分发内容 动态组件 解析DOM模板时的注意事项

2020-02-18 13:56:53

阅读数 16

评论数 0

原创 Vue基础:vue表单输入绑定

基础用法 值绑定 修饰符 在组件上使用v-model

2020-02-18 11:29:47

阅读数 10

评论数 0

原创 Vue基础:vue事件处理

Vue.js 提供了事件处理机制,事件监听使用v-on指令监听DOM事件来触发JavaScript代码。 通常情况下需要编写监听事件、方法事件处理器、内联处理器方法。 监听事件 监听事件直接把事件写在v-on指令中 <div id="app"> <p>...

2020-02-15 13:31:30

阅读数 39

评论数 0

原创 Vue基础:列表渲染

用 v-for 把一个数组对应为一组元素 在 v-for 里使用对象 维护状态 数组更新检测 对象变更检测注意事项 显示过滤/排序后的结果 在 v-for 里使用值范围 在 <template> 上使用 v-for v-for 与 v-if 一同使用 在组件上使用 v-for ...

2020-02-15 13:29:03

阅读数 16

评论数 0

原创 Vue基础:条件渲染

v-if v-if 指令用于条件性地渲染一块内容。这块内容只会在指令的表达式返回 truthy 值的时候被渲染。 <h1 v-if="awesome">Vue is awesome!</h1> 也可以用 v-else 添加一个“else 块”: <...

2020-02-15 13:24:36

阅读数 9

评论数 0

原创 Vue基础:Class与Style绑定

绑定HTML Class 1、对象语法 2、数组语法 3、用在组件上 绑定内联样式 1、对象语法 2、数组语法 3、自动添加前缀 4、多重值

2020-02-14 12:02:30

阅读数 18

评论数 0

原创 Vue基础:计算属性和侦听器

计算属性 1、简单示例 <div id="app"> <p>最初信息:{{message}}</p> <p>computed后信息:{{reversedMessage}}</p> </div> ...

2020-02-14 12:01:48

阅读数 15

评论数 0

原创 Vue基础:vue模板语法

Vue.js 使用了基于 HTML 的模板语法,允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。所有 Vue.js 的模板都是合法的 HTML ,所以能被遵循规范的浏览器和 HTML 解析器解析。 在底层的实现上,Vue 将模板编译成虚拟 DOM 渲染函数。结合响应系统,Vue 能够...

2020-02-14 12:01:02

阅读数 22

评论数 0

原创 Vue基础:vue实例

创建一个 Vue 实例 数据与方法 实例生命周期钩子 生命周期图示

2020-02-14 11:59:36

阅读数 7

评论数 0

原创 jQuery基础:jQuery选择器

jQuery选择器继承了CSS的语法,并且选择器的功能比CSS更强大,可以对DOM元素的标签名、属性名、类名、状态等进行更快速准确的选择。jQuery对象如果要使用DOM方法,有如下处理方法。 (1)如果待操作对象是DOM对象,只需要用$()把DOM对象包装起来,jQuery对象就是通过 jQue...

2020-02-13 17:51:04

阅读数 15

评论数 0

原创 jQuery基础:初识jQuery

jQuery简介 jQuery设计的宗旨是“Write Less,Do More” jQuery已经集成了JavaScript、CSS、DOM和Ajax于一体的强大功能,它可以用最少的代码完成更多复杂而困难的功能,从而得到了开发者的青睐。 jQuery的核心特性:高效灵活的CSS选择器,可以对CS...

2020-02-13 17:45:14

阅读数 18

评论数 0

原创 HTML5的IndexedDB数据库

I ndexedDB数据库概述 创建数据库 数据库的版本更新和事务处理 创建对象仓库 创建索引 保存和删除数据 使用游标检索批量数据

2020-02-12 21:48:08

阅读数 13

评论数 0

原创 HTML5的文件操作与拖放操作

file对象和FileList对象 ArrayBuffer对象与ArrayBufferView对象 Blob对象 FileReader接口 拖放API DataTransfer对象的属性与方法 拖放的应用

2020-02-12 12:05:40

阅读数 28

评论数 0

原创 HTML5地理位置笔记

地理位置信息概述 地理位置信息的内容 浏览器的“位置信息”是指安装浏览器的硬件设备的位置信息,主要指设备当前地理位置的纬度(latitude)与当前地理位置的经度(longitude)信息。 地理位置元信息的来源 (1)IP地址 (2)GPS (3)移动电话基站或无线Wi-Fi (4...

2020-02-12 12:00:23

阅读数 25

评论数 0

原创 vue基础:vue介绍

声明式渲染 响应式声明渲染机制 Vue 是一个响应式系统。 Vue.js 用模板语法声明式将数据渲染进 DOM 系统。 视图是来自状态声明映射,状态发生变化,数据自动渲染。 <!DOCTYPE html> <html> <head> <meta...

2020-02-10 17:21:44

阅读数 53

评论数 0

原创 vue入门

vue基本介绍 Vue.js 是一套响应式系统,前端开发库。 Vue.js 是一套构建用户界面的渐进式框架。 采用自底向上增量开发的设计 Vue 的核心库只关注视图层。 Vue 采用单文件组件和生态系统支持的库开发的复杂单页应用。 提供了 MVVM 数据绑定和一个可组合的组件系统。 Vue 核心库...

2020-02-10 17:21:22

阅读数 15

评论数 0

原创 HTML5:离线web应用和web存储笔记

离线web应用 离线web应用的实现 web Storage的概述 web Storage应用

2020-02-07 11:53:42

阅读数 13

评论数 0

原创 HTML5:使用web workers处理线程笔记

Web Workers概述 页面与线程数据的交互 使用ShareWorker创建共享线程

2020-02-07 11:45:22

阅读数 37

评论数 0

原创 HTML5的SVG绘图笔记6:滤镜

滤镜

2020-02-04 11:44:20

阅读数 11

评论数 0

原创 HTML5的SVG绘图笔记5:渐变与透明度

渐变 透明度

2020-02-03 17:13:22

阅读数 14

评论数 0

原创 HTML5的SVG绘图笔记4:组合与重用

组合

2020-02-03 16:16:25

阅读数 36

评论数 0

原创 HTML5的SVG绘图笔记3:变换

变换

2020-02-03 14:18:45

阅读数 34

评论数 0

原创 HTML5的SVG绘图笔记2:绘制SVG基本图形

矩形

2020-02-03 13:32:00

阅读数 22

评论数 0

原创 HTML5的SVG绘图笔记1:SVG基础

优点 缺点

2020-02-03 11:15:26

阅读数 15

评论数 0

原创 HTML5 Canvas设计动画:时钟

<style type="text/css"> div{ text-align: center; margin-top: 250px; } #clock{ border: 1px solid #ccc; } ...

2020-02-03 09:42:34

阅读数 9

评论数 0

原创 HTML5绘图笔记8:实战案例

设计canvas动画 例子1 <canvas id="myCanvas" width="400" height="200"></canvas> <script type="text/javas...

2020-02-03 09:36:27

阅读数 6

评论数 0

原创 HTML5绘图笔记7:Path2D对象

使用Path2D对象 例子1 <canvas id="myCanvas" width="600" height="400"></canvas> <script type="text/javas...

2020-02-02 16:01:18

阅读数 14

评论数 0

原创 HTML5绘图笔记6:绘制图形

导入图像 <canvas id="myCanvas" width="400" height="400"></canvas> <script type="text/javascript"...

2020-02-02 15:54:22

阅读数 26

评论数 0

原创 HTML5绘图笔记5:绘制文字

绘制填充文字 <canvas id="myCanvas" width="300" height="100"></canvas> <script type="text/javascript&quo...

2020-02-02 15:53:53

阅读数 46

评论数 0

提示
确定要删除当前文章?
取消 删除