- 博客(30)
- 资源 (12)
- 收藏
- 关注
RSS订阅原创 JavaScript 事件
1、JavaScript 的事件JavaScript 中的事件共分为鼠标事件、键盘事件、HTML 事件三大类。1.1、鼠标事件鼠标事件，就是需要通过鼠标进行触发的事件。常用的鼠标事件 事件 发生时间 onclick 用户单击对象时 ondblclick 用户双击对象时 onmouseover 鼠标移到某个元素之上时 onmouseout ...
2019-11-14 12:58:27
313
原创 BOM与DOM
1、window 对象浏览器对象模型（Brower Object Model，BOM）使 JavaScript 有能力与浏览器“对话”。BOM 由多个对象组成，其中代表浏览器窗口的 window 对象是 BOM 的顶层对象，其他对象都是该对象的子对象，如下图所示。window对象模型1.1、window 对象的属性所有浏览器都支持 window 对象，window 对象表示浏览器...
2019-11-06 22:52:32
308
原创 圣杯布局与双飞翼布局
1、作用圣杯布局与双飞翼布局都是两边顶宽，中间自适应的三栏布局，中间栏要放在文档流前面以优先渲染。2、区别圣杯布局：将中间div设置左右padding-left和padding-right，且将左右两个div用相对布局position:relative以及left和right属性，使得左右两栏div不遮挡中间div。双飞翼布局：直接在中间div内部创建子div用于放置内容，在该子d...
2019-11-01 17:32:19
219
原创 jQuery动画
jQuery的一项很强大的功能是可以在HTML元素上实现动画效果，如显示、隐藏、淡入淡出和滑动等。1、执行自定义的动画调用animate()方法可以根据一组CSS属性实现自定义的动画效果。语法如下。$(selector).animate( properties [, duration ] [, easing ] [, complete ] )参数说明如下。properti...
2019-10-03 22:33:31
281
原创 jQuery程序设计
jQuery是一套 JavaScript 脚本库，它是类似于 .NET 的类库，可将一些工具方法或对象方法封装在类库中。jQuery提供了强大的功能函数和丰富的用户界面设计。1、jQuery基础1）下载jQueryjQuery的官方地址为https://jquery.com/。可在官网中下载jQuery。每个发布的版本都有两种脚本库可供下载，即Minified版和Unc...
2019-10-02 21:55:54
465
原创 支持多线程编程的Web Workers
传统的Web应用程序都是单线程的，完成一项任务后才执行下一项的任务，因此应用程序效率自然不会高，甚至会出现网页没有响应的情况。HTML5新增了Web Workers 对象，使用Web Workers 对象可以在后台运行 JavaScript 程序，也就是支持多线程，从而提高了新一代 Web 应用程序的效率。1、概述下面介绍HTML5 Web Workers 的基本概念以及支持 Web ...
2019-09-29 21:31:19
392
原创 获取浏览器的地理位置信息
有些应用程序需要获取用户的地理位置信息，比较经典的例子就是在显示地图时标注自己的当前位置。过去，获取用户的地理位置信息需要借助第三方地址数据库或专业的开发包（如Google Gears API）。HTML5定义了Geolocation API规范，可以通过浏览器获取用户的地理位置，这无疑给有相关需求的用户提供了极大的便利。1、概述HTML5 Geolocation API 定义了与主...
2019-09-28 21:40:04
11035
原创 开发支持离线的Web应用程序
Web应用程序的资源都存储在Web服务器上，如果无法连接网络，或者Web服务器不在线，那么传统的Web应用程序就无法正常运行了，使用HTML5可以开发支持离线的Web应用程序，在连接不上Web服务器时，可以切换到离线模式；等到可以连接Web服务器时，再进行数据同步，把离线模式下完成的工作提交到Web服务器。1、HTML5离线Web应用程序概述1）什么是离线Web应用程序传统Web...
2019-09-28 17:41:10
2651
原创 本地存储
传统的Web应用程序将大多数据都存储在Web服务器端的数据库中，本地存储的能力很弱，而频繁地访问数据库服务器获取数据，不但会增加网络流量，还会影响应用程序的效率。HTML5的本地存储能力得到了很大的提高，不但可以像传统Web应用程序那样将数据存储在文件中，而且还支持本地的轻型数据库。1、概述1）HTML4的本地数据存储方式在传统的Web程序中，通常使用Cookie和Session...
2019-09-25 20:25:49
628
原创 Web通信
HTML5提供了功能强大的Web通信机制，可以实现不同域的Web应用程序之间的安全通信，也可以在JavaScript上进行HTTP（S）通信和WebSocket通信。这些都是构建桌面式Web应用的基础。1、跨文档消息机制在HTML4中，出于安全考虑，一般不允许一个浏览器的不同框架、不同标签页、不同窗口之间的应用程序互相通信，以防止恶意攻击。但在实际应用中，有时需要进行跨文档通信，例如...
2019-09-23 22:01:53
1376
原创 播放多媒体
在HTML5出现之前，要在网页中播放多媒体，需要借助Flash插件。浏览器在安装Flash插件后才能播放多媒体。使用HTML5提供的新标签<audio>和<video>可以很方便地在网页中播放音频和视频。1、HTML5音频HTML5提供了在网页中播放音频的标准，支持<audio>标签的浏览器可以不依赖其他插件播放音频。1）audio标签在HT...
2019-09-23 12:27:48
612
原创 绘制可伸缩矢量图形（SVG）
1、SVG概述可伸缩矢量图形（Scalable Vector Graphics，SVG）使用XML格式在Web上定义基于矢量的图形。矢量图形是根据几何特性来绘制的图形，矢量（Vector）可以是一个点或一条线。矢量图以几何图形居多，图形可以无限放大，不变色、不模糊，常用于图案、标志、文字等方面的设计。1）SVG的特性与JPEG和GIF等格式的图像相比，SVG图像更主要具有如下优势。...
2019-09-22 22:02:07
1782
原创 Canvas API
1、Canvas元素在HTML5网页中可以使用Canvas元素定义一个画布，这是使用Canvas API 进行画图的前提。1）Canvas元素的定义语法定义Canvas元素的语法如下所示。<canvas id="xxx" height="" width="">...</canvas>Canvas元素的常用属性如下。id：Canvas元素的标识id。...
2019-09-18 22:30:17
441
原创 HTML5拖放
拖放是一种常见的操作，就是用鼠标抓取一个对象，将其拖放到另一个位置。1、概述1）什么是拖放拖放可以分为两个动作，即拖拽（Drag）和放开（Drop）。拖拽就是移动鼠标指针到指定对象，按下左键，然后拖动对象；放开就是放开鼠标左键，放下对象。当开始拖拽时，可以提供如下信息。（1）被拖拽的数据。这可以是多种不同格式的数据，如包含字符串数据的文本对象。（2）在拖拽过程中显示在鼠标指...
2019-09-17 21:59:03
520
原创 CSS实例练习
HTML5+CSS3设计页面布局<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <...
2019-09-17 12:08:36
875
原创 Vue.js的使用
在Vue.js表单控件上实现双向数据绑定在Vue.js中，可以在表单控件上使用v-model属性实现双向数据绑定。双向数据绑定是指表单控件的值与其绑定到的Vue模型属性值保持一致。无论谁改变了，另一方也会随之改变。1、在input和textarea元素上实现双向数据绑定在input和textarea元素上实现双向数据绑定。<!DOCTYPE html><htm...
2019-09-14 20:32:39
194
原创 HTML5表单及文件处理
1、HTML4表单表单是网页中的常用组件，用户可以通过表单向服务器提交数据。表单中可以包括标签（静态文本）、单行文本框、滚动文本框、复选框、单选按钮、下拉菜单（组合框）和按钮等控件。1）定义表单可以使用<form>...</form>标签定义表单。表单的常用属性及说明 属性 具体描述 id 表单ID，用来标记一个表单 name ...
2019-09-14 19:30:14
2170
原创 使用webpack+Vue构建模块化项目
webpack+Vue是一种常用的构建模块化项目的组合。webpack是模块打包工具，它可以分析项目结构，找到JavaScript模块以及其他浏览器不能直接运行的扩展语言（如Scss、TypeScript 等），并将其打包为合适的格式供浏览器使用。webpackwebpack将项目作为一个整体，并指定一个主文件（如main.js）。webpack可以从主文件开始找到项目中的依赖文件，然...
2019-09-10 13:04:59
519
1
原创 JavaScript小知识（2）
MVVM开发模式MVVM是Model View ViewModel的缩写。其中，Model（模型）是指数据类型，如数据库记录。通常模型对象负责在数据库中存取数据；View（视图）是应用程序中处理数据显示的部分；ViewModel负责数据转换，将Model的变化反映到View上，如果View自身发生了变化，ViewModel也负责将此变化同步到Model。MVVM的开发模式如下所示。M...
2019-09-09 15:59:29
181
原创 移动端布局与响应式开发
1、移动端布局1）手机的基本概念（1）屏幕分辨率iPhone5的屏幕分辨率为1136×640，指手机的竖排有1136个像素，横排有640个像素。即屏幕像素为72.7万。并不是屏幕的分辨率越高屏幕越大，屏幕的大小由屏幕的尺寸决定，屏幕的尺寸指屏幕对角线的长度，一般单位为英寸。（2）物理像素与CSS像素上面提到的iPhone5的屏幕分辨率指的是物理像素。物理像素的单位为dp（点...
2019-09-03 10:02:58
379
原创 CSS3动画与3D
1、CSS3过渡在CSS3中，可以利用transition属性使元素的某一个属性在指定的时间内从“一个属性值”平滑过渡到“另外一个属性值”，从而实现动画效果。1）transition属性（1）transition-duration属性transition-duration属性表示过渡的持续时间，单位可以设置成s（秒）或ms（毫秒）。（2）transition-property属...
2019-09-02 12:51:58
395
原创 CSS3基础样式
1、浏览器内核介绍浏览器内核主要分成两部分：渲染引擎和JavaScript引擎。1）渲染引擎负责获取网页内容（HTML、XML、图像等）、整理信息（如加入CSS等）以及计算网页的显示方式，然后输出至显示器或打印机。所有网页浏览器、电子邮件客户端及其他需要编辑、显示网络内容的应用程序都需要内核。浏览器内核的不同对于网页的语法解释也会有不同，所以渲染的效果也不同。2）JavaScript引...
2019-09-01 13:02:47
462
原创 HTML5新增属性
1、HTML5新增属性1）data-*属性data-*属性用于自定义属性，所谓data-*实际上是data-前缀加上自定义的属性名，使用这样的结构可以进行数据存放。使用data-*可以解决自定义属性混乱无管理的现状。data-*设置在HTML标签上，页面中不显示任何数据，只能通过JavaScript的方式来获取数据。<div data-name="新增标签" data-in...
2019-08-29 21:50:21
617
原创 HTML5新增标签
在HTML5新规范中，新增了一些便于使用的标签。新标签可分为结构标签、媒体标签、表单控件标签和其他标签四类。1、结构标签在HTML5结构标签出现之前，当书写页面的布局结构时，都是采用<div>标签来实现。现在可以采用HTML5提供的结构标签进行布局，而且这些结构标签通常都带有语义化，因此更有利于优先搜索引擎。（这是W3C推荐的方式，未来将通过逐步利用结构标签取代<div&...
2019-08-29 20:38:42
545
原创 HTML5新增语法
1、DOCTYPE文档及编码HTML5模式下的 DOCTYPE 文档写法非常简单，只需要通过一句简单的代码即可实现。<!DOCTYPE html>比起 HTML4.01和XHTML2.0时的 DOCTYPE 文档写法，HTML5模式下的 DOCTYPE 文档写法更简便。除了文档简便，其编码写法也得到了简化，只需要指定编码方式即可。<meta charset="...
2019-08-27 16:53:31
452
原创 网页模块命名规范
通常网页模块的命名规范需要遵循以下三个原则：命名避免使用中文字符（如id=“内容”）； 命名不能以数字开头（如id=“1header”）； 命名不能使用关键字（如id=“div”）；命名应尽量用最少的字母表达含义，使之简明、易懂。在网页开发中，常用驼峰式命名和帕斯卡命名两种命名方式。其具体解释如下所述。驼峰式命名：除第一个单词外后面的单词首字母都要大写，其余小写，如navOne...
2019-08-23 17:15:44
3973
原创 HTML、CSS小知识
背景样式设置背景样式的属性 属性 含义 color 设置前景颜色。 background-color 设置背景色 background-image 设置背景图片的URL地址 background-repeat 设置背景图片的平铺方式 background-position 用于改变背景图片的位置。此位置是相对于左上角的相对位置。 b...
2019-08-17 12:25:43
967
原创 JavaScript算法题
Reverse a String翻转字符串先把字符串转化成数组，再借助数组的reverse方法翻转数组顺序，最后把数组转化成字符串。你的结果必须得是一个字符串function reverseString(str) { var array = str.split(""); array.reverse(); str = array.join(""); return s...
2019-08-10 21:51:22
195
原创 JavaScript小知识（1）
当 JavaScript 中的变量被声明的时候，程序内部会给它一个初始值 undefined。当你对一个值为 undefined 的变量进行运算操作的时候，算出来的结果将会是 NaN，NaN 的意思是 "Not a Number"。当你用一个没有 定义 的变量来做字符串连接操作的时候，它会如实的输出"undefined"。摄氏度转华氏度小应用摄氏度的温度乘以9除以5，再加上3...
2019-08-07 16:46:22
456
原创 搭建Linux服务器+Web项目的部署（CentOS6）
Linux服务器下Web有关资源的搭建~1、搭建服务器可以通过在阿里云、腾讯云、Vultr等地方进行购买服务器或者自行搭建服务器然后在服务器中安装CentOS6操作系统（阿里云网站：https://www.aliyun.com/product/ecs）（腾讯云网站：https://cloud.tencent.com/product/cvm）（Vultr网站：https...
2019-07-25 15:18:48
956
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人