Richard_xx-CSDN博客

原创 indexedDB(1)__初识数据库<基本步骤,增删查改>

一、本地存储Cookie，sessinStorage，localStorage的区别：二、数据库分类：根据存放的数据的结构类型，可以分为：关系型数据库和非关系型数据库。关系型数据结构：非关系型数据结构：同步和异步：同步，比如两个人通话，必须同时接通之后，才能继续说话。异步，比如

2017-08-11 16:28:20 1649

原创 WebStorage(1)__<本地数据,离线缓存>

一、离线缓存网络状态：浏览器的网络状态是否畅通与网线是否连接没有关系，只要设备的网卡在活动，那么网络就是畅通的。 1.通过navigator.onLine的值判断true：网络畅通false：网络断开 2. 给window对象添加事件，可以动态地监听网络状态的变化：window.addEventListener("online",onlineCa

2017-08-11 16:14:19 589

原创 Bootstrap(3)__Bootstrap基础<导航,轮播,下拉表>

下拉菜单dropdown">//dropdoup上啦<button class="btn btn-default"data-toggle="dropdown">//开关下拉菜单dropdown-menu">北京成都上海阆中 //1.菜单项向右对齐,默认是dropdown-menu-left //2.设置菜单的标题(不要加超链接

2017-08-11 14:46:47 1810

原创 Bootstrap(2)__Bootstrap基础<栅格系统>

简单了解:栅格系统英文为“gridsystems”，也有人翻译为“网格系统”，运用固定的格子设计版面布局，其风格工整简洁，在二战后大受欢迎，已成为今日设计的主流风格之一。网页栅格系统:以规则的网格阵列来指导和规范网页中的版面布局以及信息分布。网页栅格系统是从平面栅格系统中发展而来。对于网页设计来说，栅格系统的使用，不仅可以让网页的信息呈现更加美观易读，更具可用性。而且，对于前端开发来说

2017-08-11 14:29:31 764

原创 Bootstrap(1)__Bootstrap基础<页面排版,图片,按钮,表格,表单>

Bootstrap是一个基于HTML CSSJavaScript的开源框架,用于快速构建基于PC端和移动端设备的响应式web页面.CDN:   文件。务必在bootstrap.min.js之前引

2017-08-11 14:21:50 2199

原创 jQuery(4)__jQuery基础<Ajax>

常用方法$()传入一个函数,会执行它(功能代码块)//$(function(){xxxxxx})$(document).ready(function(){//文档加载完毕的回调函数})$.noConflict()//var jq=$.noConflict()//避免冲突,更改调用名字$.parseJSON()//$.parseJSON(‘{“name”:”karen”}’)//

2017-08-10 16:14:29 295

原创 jQuery(3)__jQuery基础<事件>

事件(returnfalse阻止冒泡)鼠标//基础好的:123次点击,右键点击click 单击对象(按下松开)dblclick 双击对象mousedown 在对象上按下时mouseup 按下,在对象上松开时mousemove 鼠标在对象上移动时mouseover 鼠标指针穿过被选元素区域触发,穿过其子元素区域也触发mouseout 鼠标指针离开被选元素或者子元素

2017-08-10 16:05:57 299

原创 jQuery(2)__jQuery基础<遍历,盒子>

遍历①长辈parent()//爸爸parents()//爸爸爷爷...parentsUntil()//爸爸爷爷..到某个标签结束例:jq(“span”).parent(“div”).css({"background-color":"blue"})//span的爸爸并且还得是div的背景为bluejq(“span”).parents().css({"background-

2017-08-10 15:58:23 395

原创 jQuery(1)__jQuery基础<对象,元素,属性>

什么是jquery1.Jquery是一个js函数库,又常常被叫做jq,里面代码很多,但是用的时候代码很少,是目前js的主流框架2.使用JQ就可以做出我们前面做过的所有效果,那为何还要学习js? Js是语言基础,jq是js的代码库的封装,比如在jq中我们不可能看到基本数据类型有哪些,因为js有哪些jq中使用得就是这些,不管js还是jq,都是我们做项目使用得工具而已,要做出漂亮并且高性能的

2017-08-10 15:31:35 327

原创 Js_Dom(9)__Dom基础<Ajax请求>

什么是AJAXAJAX 是一种用于创建快速动态网页的技术传统的网页（不使用 AJAX）如果需要更新内容，必需重载整个网页面AJAX通过在后台与服务器进行少量数据交换，AJAX可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新有很多使用 AJAX 的应用程序案例：新浪微博、Google 地图、开心网等等等底层原理:

2017-08-09 15:30:47 587

原创 Js_Dom(8)__Dom基础<画布canvas>

canvas标签1.Canvas是HTML5提供的一个标签,我们可以在这个盒子区域绘画2.怎么绘画的呢?canvas对象有个一个方法可以让我们获取到一个CanvasRendderingContext2D对象,这个对象给我们提供了在canvas盒子上画图的功能.3.不是所有的浏览器都支持canvas标签,几乎所有智能手机都支持这个标签4.canvas市场:游戏,广告,动画,数据图形结

2017-08-09 15:20:08 649

转载 Js_Dom(7)__Dom基础<Dom的12种节点(转载)>

12种DOM节点类型概述DOM是javascript操作网页的接口，全称为文档对象模型(Document Object Model)。它的作用是将网页转为一个javascript对象，从而可以使用javascript对网页进行各种操作(比如增删内容)。浏览器会根据DOM模型，将HTML文档解析成一系列的节点，再由这些节点组成一个树状结构。DOM的最小组成单位叫做节点(node)，文档的

2017-08-09 15:13:53 337

原创 Js_Dom(6)__Dom基础<Bom,window,计时器以及空野指针>

BOM对象BOM是browser object model的缩写，简称浏览器对象模型由一系列功能的对象构成，核心对象是windowBOM缺乏标准(不过所有浏览器都支持)，JavaScript语法的标准化组织是ECMA，DOM的标准化组织是W3C//一定要记住,BOM不是W3C的标准模型windowwindow对象是BOM的顶层(核心)对象，所有对象都是通

2017-08-09 15:03:27 361

原创 Js_Dom(5)__Dom基础<事件event>

鼠标事件1.事件onclick 单击对象(按下松开)ondblclick 双击对象onmousedown 在对象上按下时onmouseup 按下,在对象上松开时onmousemove 鼠标在对象上移动时onwheel 鼠标滚动时onmouseover 鼠标指针穿过被选元素或其子元素区域onmouseout 鼠标指针离开被选元素或者子元素区域onmouseen

2017-08-09 14:54:39 281

原创 Js_Dom(4)__Dom基础<回流与重绘>

1.页面呈现过程不同的浏览器略微会有些不同。但基本上都是类似的①.浏览器把html代码解析成1个Dom树，html中的每个tag都是Dom树中的1个节点，根节点就是我们常用的document对象。dom树就是html结构，里面包含了所有的html tag，包括用JS添加的元素。 ②浏览器把所有样式(主要包括css和浏览器自带的样式设置)解析成样式结构体，在解析的过程中会

2017-08-08 19:15:36 545

原创 Js_Dom(3)__Dom基础<节点常用属性方法和table>

1.文档节点(document)属性:all文档中所有HTML元素集合//例document.all[2]anchors文档中所有锚点对象集合forms文档中所有form对象集合images文档中所有img对象集合body,cookie,domain,lastModified,referrer,title,URL方法:getElementById()返回对拥

2017-08-08 19:06:17 311

原创 Js_Dom(2)__Dom基础<方法(重点)>

1.getElementById() 返回带有指定ID的元素//得到元素对象后就可以获取和更改对象的属性根据指定的 id 属性值得到对象。返回 id 属性值对应的第一个对象的引用。假如对应的为一组对象，则返回该组对象中的第一个。如果无符合条件的对象，则返回 null var test=document.getElementById(‘test’) 2.getElementsB

2017-08-08 18:57:58 289

原创 Js_Dom(1)__Dom基础<对象和document>

在学习Dom之前我们先了解一个概念,文档树~~~文档树节点HTML DOM将 HTML文档视作树结构。这种结构被称为节点树HTML 文档中的所有内容都是节点1.整个文档是一个文档节点2.每个 HTML元素是元素节点3.HTML元素内的文本是文本节点4.每个 HTML属性是属性节点5.注释是注释节点节点

2017-08-08 18:51:17 354 1

原创 JavaScript(7)__Js基础<构造>

1：对象的概念“面向对象编程”（Object OrientedProgramming，缩写为OOP）是目前主流的编程范式。它的核心思想是将真实世界中各种复杂的关系，抽象为一个个对象，然后由对象之间的分工与合作，完成对真实世界的模拟。传统的过程式编程（proceduralprogramming）由一系列函数或一系列指令组成，而面向对象编程的程序由一系列对象组成。每一个对象都是功能中心，具有明

2017-08-07 22:15:25 409

原创 JavaScript(6)__Js基础<对象>

1：正则表达式常用的正则表达式：有效数字的var reg=/^[+-]?(\d|([1-9]\d+))(\.\d+)?$/; 邮箱：var reg =/^\w+((-\w+)|(\.\w+))*@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/; 电话：var reg = /^1\d{10}$/;

2017-08-07 17:22:35 341

原创 JavaScript(5)__Js基础<函数>

1：函数的概述函数就是一段可以反复调用的代码块。函数还能接受输入的参数，不同的参数会返回不同的值。2：函数的声明1：具有函数function命令声明的代码区块，就是一个函数。function命令后面是函数名，函数名后面是一对圆括号，里面是传入函数的参数。函数体放在大括号里面。2：匿名函数（函数表达式）这种写法将一个匿名

2017-08-07 16:57:07 633

原创 JavaScript(4)__Js基础<字符串>

1：字符串对象的创建var str="hello world"; var str= new String('hello world');字符串可以被视为字符数组，因此可以使用数组的方括号运算符，用来返回某个位置的字符（位置编号从0开始）。但是，字符串与数组的相似性仅此而已。实际上，无法改变字符串之中的单个字符。2：字符串的length属性length属性

2017-08-07 16:30:38 300

原创 JavaScript(3)__Js基础<数组>

1：数组的定义 1：定于并且赋值，定义要用的中括号2：先定义，再赋值2：数组的键名JavaScript语言规定，对象的键名一律为字符串，所以，数组的键名其实也是字符串。之所以可以用数值读取，是因为非字符串的键名会被转为字符串。3：数组的length长度 1：只要是数组，就一定有lengt

2017-08-06 20:50:59 285

原创 JavaScript(2)__Js基础<if swich while>

1：条件控制语句条件语句提供一种语法构造，只有满足某个条件，才会执行相应的语句。JavaScript提供if结构和switch结构，完成条件判断。1：if语句：如果……那么……否则…… if(明天不下雨){ 我就出去玩；}else{ 我就在家写作业;}注意：条件表达式，要么是true、要么是f

2017-08-06 19:49:37 1095

原创 JavaScript(1)__Js基础<数据类型，基本语法，运算符>

首先在学习之前，我们要了解web前端三层架构：（重点）1：HTML：结构层：从语义的角度，去描述页面的结构2：CSS：样式层：从审美的角度，去美化页面3：JS：行为层：从交互的角度，去提升用户体验注意：Java和JavaScript没有关系1：JS代码写在哪里？1：所有的Js代码写在Script标签中 2：可以放在HTML中的任意位置，一

2017-08-06 19:07:57 845

原创 CSS(7)__CSS基本用法<CSS常用属性>

一 CSS文字属性：color :#999999; /*文字颜色*/font-family: 宋体,sans-serif; /*文字字体*/font-size : 9pt; /*文字大小*/font-style:itelic; /*文字斜体*/font-variant:small-caps; /*小字体*/letter-spacing : 1pt; /*字间距离*/

2017-08-05 09:00:17 339

原创 CSS(6)__CSS基本用法<2D属性和3D特效>

1、CSS3 2D transform 属性l transform属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行旋转、缩放、移动或倾斜。transform的属性包括：rotate( ) 旋转/ skew( ) 倾斜/ scale( ) 缩放/ translate( ) 平移，分别还有x、y之分，比如：rotatex( ) 和 rotatey( ) ，以此类推。

2017-08-05 08:43:43 502

原创 CSS(5)__CSS基本用法<选择器和一些特效>

1.关于CSS3CSS3是CSS2的升级版本，3只是版本号，它在CSS2.1的基础上增加了很多强大的新功能。目前主流浏览器chrome、safari、firefox、opera、甚至360都已经支持了CSS3大部分功能了，IE10以后也开始全面支持CSS3了。文本，背景，动画，2d 3d转换伸缩布局，多列布局在编写CSS3样式时，不同的浏览器可能需要不同的前缀。它表示该CSS属性

2017-08-03 22:59:56 615

原创 HTML5(5)__H5新增标签

1：换个角度认识HTML5HTML5并不仅仅只是作为HTML标记语言的一个最新版本，更重要的是它制定了Web应用开发的一系列标准，成为第一个将Web做为应用开发平台的HTML语言。HTML5定义了一系列新元素，如新语义标签、智能表单、多媒体标签等，可以帮助开发者创建富互联网应用，还提供了一系列Javascript API，如地理定位、重力感应、硬件访问等，可以在浏览器内实现

2017-08-03 22:41:30 654

原创 CSS(4)__CSS基本用法<三种定位>

一、相对定位定位有三种，分别是相对定位、绝对定位、固定定位。相对定位：1 position:relative;绝对定位：1 position:absolute;固定定位：1 position:fixed;每一种定位，都暗藏玄机，所以我们分别讲解。2.1 认识相对定位相对定位，就是微调元素位置的。让元素相对自己原来的位置

2017-07-30 22:58:36 568

原创 CSS(3)__CSS基本用法<div,文档流,浮动>

1：盒子模型--div1：画图理解盒子模型2：一个盒子占据的控件是边框 + 内边距 + 内容区域Margin:外边距Width=(margin+border+padding)*2+content一个盒子中主要的属性就5个：width、height、padding、border、margin。width是“宽度”的意思，CSS中width指的是内容的宽

2017-07-30 22:28:39 615

原创 CSS(2)__CSS基本用法<背景,文字排版>

1 CSS的颜色表示 1：命名颜色 red，white，purple，green，yellow，silver，blue 2：RGB颜色表示法 a： rgb:red; b: rgb(255,255,0) c: #F1F1F1 background-color: rgb(100, 200, 100);0-255

2017-07-20 17:27:12 494

原创 CSS(1)__CSS基础

在上一个阶段的学习中,相信大家对H5的认识有了一个全新的提高,对标签的使用和了解也应该有了自己独到的认识.当然学海无涯,我们也只是刚刚开始而已.好,话不多说,开始我们的这一阶段的学习!!!~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~在学

2017-07-20 17:04:20 415

原创 HTML5(4)__H5基本语法(下)

14：表格标签 HTML 表格表格由标签来定义。每个表格均有若干行（由标签定义），每行被分割为若干单元格（由标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。1 没有边框的表格：这个表格没有边框: 100 200 300 400

2017-07-20 16:27:07 858

原创 HTML5(3)__H5基本语法(上)

1 HTML基本骨架html> 声明文档类型html lang="en"> 根标签head> 头标签 meta charset="UTF-8"> title>Titletitle> 标题标签head>body> 主体标签body>html>

2017-07-19 16:43:02 4439

原创 HTML5(2)__初识H5

1 认识什么是纯文本文件txtwindows中自带一个软件，叫做记事本。记事本保存的文档格式就是txt格式，就是英语text的缩写。术语上，称呼这个文件叫做“纯文本文件”。txt文件，只能保存文本内容，是无法记录文本样式的。所以，doc和txt存储同样的内容，doc比txt大：例如: 2 HTML是负责描述文档语义的语言HTML

2017-07-19 15:47:41 504

原创 HTML5(1)__简介

网页是真实物理的文件。并且一个网页是很多的物理文件组成的：html文件、图片文件、js文件、css文件。这些文件要通过特殊软件才能上传到服务器上。然后就能让用户看了。用户通过浏览器，访问网址，服务器上面的文件就会通过http请求悄悄地传输到用户的电脑中的临时文件夹中，在用户的电脑中执行、渲染、呈递.

2017-07-19 14:47:10 484

Richard_xx的博客