09 2019 档案
摘要：JS对象转为类似json的字符串，对象->字符串叫序列化，字符串->对象 是反序列化 ㈠json序列化 <script> var shy = new Object(); shy.name = "石海莹"; shy.birth="1996年9月20日" document.write("姓名:"+shy
阅读全文
摘要：㈠Animation&Transition&gradients 代码示例 圆形，渐变颜色，旋转，当鼠标放在圆上，圆旋转变大 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>复合属性</title> <styl
阅读全文
摘要：㈠什么是json？ JSON(JavaScript Object Notation, JS 对象简谱) 是一种轻量级的数据交换格式。它基于ECMAScript(欧洲计算机协会制定的js规范)的一个子集，采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得JSON 成为理想的数据
阅读全文
摘要：㈠数组转字符串 ⑴String（arr）：将arr中的每个元素转为字符串，用逗号分隔 固定套路：对数组拍照：用于鉴别是否数组被修改过 ⑵arr.join("连接符")：将arr中每个元素转为字符串，用自定义的连接符分隔 // 将字符拼接为单词 var chars = ["H","e","l","l"
阅读全文
摘要：㈠方式一：通过DOM节点的 style 样式获取 dom.style.width/height 只能获取使用内联样式的元素的宽和高。 效果图： js获取的高度和宽度的结果如下： 缺点：通过这种方式，只能获取行内样式，不能获取内嵌的样式和外链的样式。 ㈡方式二（通用型） ⑴window.getComp
阅读全文
摘要：㈠box-sizing 属性 ⑴box-sizing 属性允许您以特定的方式定义匹配某个区域的特定元素。 ⑵语法：box-sizing: content-box|border-box|inherit; ⑶取值 ㈡content-box相关内容 ⑴padding和border不被包含在定义的width
阅读全文
摘要：JavaScript 可以在时间间隔内执行，这就是所谓的定时事件（ Timing Events）。 ㈠Timing 事件 ⑴window 对象允许以指定的时间间隔执行代码，这些时间间隔称为定时事件。 ⑵通过 JavaScript 使用的有两个关键的方法： ①setTimeout(function,
阅读全文
摘要：㈠用HTML5+CSS3做无限滚动效果 ⑴逻辑分析 ⑵实践示例 前5张图片为所有图片显示区，假设总长度为1100px； 后面出现的五张图片为克隆区，只是将前面的图片拷贝了一份； 然后将前五张和后五张的内容“捆绑”放在一个ul中，滚动的时候，就可以使得他们整体移动了 为了方便起见，尽量将ul的宽度设置
阅读全文
摘要：㈠动画属性 ⑴animation-name：指定要绑定到选择器的关键帧的名称。 ⑵animation-duration：定义动画完成一个周期需要多少秒或毫秒 ⑶animation-timing-function：指定动画将如何完成一个周期。 ⑷animation-delay：属性定义动画什么时候开始
阅读全文
摘要：㈠什么是关联数组 可以自定义下标名称的数组 ㈡为什么 索引数组中的数字下标没有明确的意义 ㈢何时 只希望每个元素都有专门的名称时 ㈣如何：2步 1）创建空数组 2）向空数组中添加新元素，并自定义下标名称 ㈤创建方式 var bookInfo= [ ]; bookInfo['bookName'] =
阅读全文
摘要：索引数组：下标是数字数组 ㈠什么是？ 内存中连续储存多个数据的数据结构，再起一个统一的名字 ㈡为什么？ ①普通的变量只能存储一个数据程序=数据结构+算法 ②算法：解决问题的步骤 ③数据结构：数据在内存中的存储结构 好的数据结构可以极大的提高程序的执行效率 ㈢何时？ 只要存储多个连续的数据 ㈣创建 ★
阅读全文
摘要：㈠什么是循环结构 ⑴什么是循环？ 反复一遍又一遍的做着相同（相似）的事情 ⑵循环中的两大要素 ①循环条件：什么时候开始，什么时候结束 ②循环操作：循环体，循环过程中，干了什么 ㈡循环结构—while循环 ⑴语法 while（boolean表达式）{ 循环体语句； } ⑵流程 ①判断条件 ②如果条件为
阅读全文
摘要：㈠switch-case 使用场合 优先用于等值判断的条件中 ㈡switch-case 语句执行逻辑 switch case语句是一种特殊的分支结构，可以根据一个表达式的不同取值，从不同的程序入口开始执行 流程： ⑴计算变量或表达式的值 ⑵计算出来的值与case后的数值，做等值判断，如果判断相等的话
阅读全文
摘要：㈠程序 ⑴程序的流程控制 程序=数据+算法 ⑵程序的三种结构： ①顺序结构 ②分支结构 ③循环结构 ㈡IF结构 ⑴什么是分支结构？ 程序在运行过程中，根据不同的条件，选择执行某些语句 ⑵什么是IF结构 当条件满足时，运行某些语句 当条件不满足时，则不运行这些语句 ⑶语法 if （条件表达式）{ 语句
阅读全文
摘要：㈠预定义类 示例：匹配一个ab+数字+任意字符的字符串：ab\d. ㈡边界 正则表达式常用的边界匹配字符 ⑴示例1：第一个是没写单词边界 第二个是加上字符边界的效果 第三个是为this的is替换成0，前面没有单词边界，后面有边界的示例。 ⑵示例2：常用边界字符“^”与“$”基本含义的举例 注意观察两
阅读全文
摘要：㈠什么是SEO？ 搜索引擎优化，又称为SEO，即Search Engine Optimization，它是一种通过分析搜索引擎的排名规律，了解各种搜索引擎怎样进行搜索、怎样抓取互联网页面、怎样确定特定关键词的搜索结果排名的技术。 ㈡分类 搜索引擎优化的技术手段主要有黑帽(black hat)、白帽(
阅读全文
摘要：㈠RegExp 对象 ⑴JavaScript通过内置对象RegExp支持正则表达式 ⑵有两种方法实例化RegExp对象 ①字面量 ②构造函数 ⑶字面量示例 示例1： 你会发现只匹配了第一个结果 示例2： 通过修饰符g，全文搜索匹配，所有的is都被替换了 ⑷构造函数示例 ㈡修饰符 ①g：global
阅读全文
摘要：㈠校验数字的表达式 数字：^[0-9]*$ n位的数字：^\d{n}$ 至少n位的数字：^\d{n,}$ m-n位的数字：^\d{m,n}$ 零和非零开头的数字：^(0|[1-9][0-9]*)$ 非零开头的最多带两位小数的数字：^([1-9][0-9]*)+(\.[0-9]{1,2})?$ 带1-
阅读全文
摘要：㈠RegExp 对象 正则表达式是描述字符模式的对象。 正则表达式用于对字符串模式匹配及检索替换，是对字符串执行模式匹配的强大工具。 ㈡语法 var patt=new RegExp(pattern,modifiers);或者更简单的方式:var patt=/pattern/modifiers; ⑴p
阅读全文
摘要：㈠什么是正则表达式？ ⑴正则表达式，又称规则表达式。（英语：Regular Expression，在代码中常简写为regex、regexp或RE），计算机科学的一个概念。 正则表达式通常被用来检索、替换那些符合某个模式(规则)的文本。 ⑵正则表达式是对字符串操作的一种逻辑公式，就是用事先定义好的一些
阅读全文
摘要：JavaScript 函数是被设计为执行特定任务的代码块。 JavaScript 函数会在某代码调用它时被执行。 ㈠函数 ⑴什么是函数 函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。 ⑵为何使用函数？ 能够对代码进行复用：只要定义一次代码，就可以多次使用它。 能够多次向同一函数传递不同
阅读全文
摘要：比较和逻辑运算符用于测试 true 或 false。 ㈠比较运算符 ⑴比较运算符在逻辑语句中使用，以判定变量或值是否相等。 ⑵我们给定 x = 5，下表中解释了比较运算符： 示例1： 示例2：加了字符串的例子 ㈡逻辑运算符 ⑴逻辑运算符用于判定变量或值之间的逻辑。 ⑵我们给定 x = 6 且 y =
阅读全文
摘要：处理数值的典型情景是数值计算。 ㈠JavaScript 算术运算符 算术运算符对数值（文字或变量）执行算术运算。 ㈡算术运算符 典型的算术运算会操作两个数值。 ⑴这两个数可以是字面量： ⑵变量： ⑶表达式： ㈢运算符和操作数 ⑴在算术运算中，数被称为操作数。 ⑵（两个操作数之间执行的）运算由运算符定
阅读全文
摘要：㈠JavaScript 运算符 ⑴运算符 = 用于赋值。 ⑵运算符 + 用于加值。 ⑶示例： 向变量赋值，并把它们相加： var x = 7; // 向 x 赋值 5 var y = 8; // 向 y 赋值 2 var z = x + y; // 向 z (x + y) 赋值 7 ㈡JavaScr
阅读全文
摘要：JavaScript 字符串用于存储和操作文本。 ㈠JavaScript 字符串 ⑴JavaScript 字符串是引号中的零个或多个字符。 例如：var x = "Bill Gates" ⑵能够使用单引号或双引号： var carname = "Volvo XC60"; var carname =
阅读全文
摘要：JavaScript 对象是拥有属性和方法的数据。 ㈠对象，属性和方法 为了能更加清晰的了解对象，属性和方法的概念，拿身边的例子进行阐述 ⑴对象：真实生活中，一辆汽车是一个对象。 ⑵属性：汽车的重量和颜色是对象的属性 ⑶方法：汽车的启动与停止是方法。 所有汽车都有这些属性，但是每款车的属性都不尽相同
阅读全文
摘要：㈠闰年是如何来的？ 闰年(Leap Year)是为了弥补因人为历法规定造成的年度天数与地球实际公转周期的时间差而设立的。补上时间差的年份为闰年。 ㈡什么是闰年？ 凡阳历中有闰日(二月为二十九日)的年，或阴历中有闰月(一年有十三个月)的年；闰余(岁余置闰。阴历每年与回归年相比所差的时日)。 闰年共有3
阅读全文
摘要：★值类型(基本类型)：字符串（String）、数字(Number)、布尔(Boolean)、对空（Null）、未定义（Undefined）、Symbol。 ★引用数据类型：对象(Object)、数组(Array)、函数(Function)。 ☀Symbol 是 ES6 引入了一种新的原始数据类型，表
阅读全文
摘要：变量是用于存储信息的"容器"。 ㈠用代码来更加立体化认识 在浏览器输出的内容如下： ㈡就像代数那样 x=5y=6z=x+y 在代数中，我们使用字母（比如 x）来保存值（比如 5）。 通过上面的表达式 z=x+y，我们能够计算出 z 的值为 11。 在 JavaScript 中，这些字母被称为变量。
阅读全文
摘要：JavaScript 注释可用于提高代码的可读性。 ㈠JavaScript 注释（单行） JavaScript 不会执行注释。 我们可以添加注释来对 JavaScript 进行解释，或者提高代码的可读性。 单行注释以 // 开头。 示例介绍： 页面输出结果为： ㈡JavaScript 多行注释 多行
阅读全文
摘要：㈠简单介绍 ⑴语法：<marquee></marquee> 以下是一个最简单的例子： 代码如下: <marquee><font size=+3 color=red>Hello, World</font></marquee> ⑵下面这两个事件经常用到： onMouseOut="this.start()
阅读全文
摘要：JavaScript 语句向浏览器发出的命令。语句的作用是告诉浏览器该做什么。 简单举例，更加的实体化了解。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>JavaScript语句</title> </head> <body>
阅读全文
摘要：HTML DOM 事件允许Javascript在HTML文档元素中注册不同事件处理程序。 事件通常与函数结合使用，函数不会在事件发生前被执行！ (如用户点击按钮)。 鼠标事件 键盘事件 框架/对象（Frame/Object）事件 表单事件 剪贴板事件 打印事件 拖动事件 多媒体（Media）事件 动
阅读全文
摘要：㈠Date 对象 Date 对象用于处理日期与时间。 创建 Date 对象： new Date() 以下四种方法同样可以创建 Date 对象： var d = new Date(); var d = new Date(milliseconds); var d = new Date(dateStrin
阅读全文
摘要：JavaScript 是一个程序语言。 语法规则定义了语言结构。 它是一个轻量级，但功能强大的编程语言。 ㈠JavaScript 字面量 在编程语言中，一般固定值称为字面量，如 3.14。 ⑴数字（Number）字面量 可以是整数或者是小数，或者是科学计数(e)。 <!DOCTYPE html> <
阅读全文
摘要：JavaScript 没有任何打印或者输出的函数。 ㈠JavaScript 显示数据 ⑴使用 window.alert() 弹出警告框。 ⑵使用 document.write() 方法将内容写到 HTML 文档中。 ⑶使用 innerHTML 写入到 HTML 元素。 ⑷使用 console.log
阅读全文
摘要：你好！JavaScript！！！ ㈠什么是JavaScript？？？ JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网
阅读全文
摘要：今天要分享一组代码，当鼠标悬停在按钮上时。按钮抖动！！！ 效果图（静态截图）： 想要看具体的动图，那就动手敲起来吧，效果图很可爱滴呦！！！
阅读全文
摘要：CSS3 可以将文本内容设计成像报纸一样的多列布局 ㈠CSS3 多列属性 ㈡column-count 属性 ⑴语法：column-count: number|auto; ⑵值： ㈢column-gap 属性 ⑴语法：column-gap: length|normal; ⑵值： ㈣column-rul
阅读全文
摘要：一，函数 Math.ceil(); //向上取整。 Math.floor(); //向下取整。 Math.round(); //四舍五入。 Math.random(); //0.0 ~ 1.0 之间的一个伪随机数。【包含0不包含1】 //比如0.8647578968666494 Math.ceil(
阅读全文
摘要：javaScript内置函数 1.Date：日期函数 属性:constructor 所修立对象的函数参考prototype 能够为对象加进的属性和方法 方法:getDay() 返回一周中的第几天(0-6)getYear() 返回年份.2000年以前为2位,2000(包括)以后为4位getFullYe
阅读全文
摘要：㈠简单介绍 在浏览网页时，通常看到的鼠标光标形状有箭头、手形、沙漏等，而在 windows 中实际看到的鼠标指针种类比这个还要多。 一般情况下，鼠标光标的形状由浏览器负责控制，大多数情况的光标形状为箭头形状，当指向链接时，光标形状会变成手指形状。 cursor 属性规定要显示的光标的类型（形状）。
阅读全文
摘要：一、箭头产生的原理 #demo12 { border: 100px solid; border-color:green blue orange red; width:100px; height:100px; } <div id="demo12"></div> 第一步：设置一个div，然后给他设置样式
阅读全文
摘要：CSS伪元素是用来添加一些选择器的特殊效果。用于：向某个选择器中的文字的首行。 ㈠语法 ①伪元素的语法： selector:pseudo-element {property:value;} ②CSS类也可以使用伪元素： selector.class:pseudo-element {property:
阅读全文
摘要：总结介绍如何通过使用 CSS 来创建分页的实例。 ㈠简单分页 如果你的网站有很多个页面，你就需要使用分页来为每个页面做导航。 以下实例演示了如何使用 HTML 和 CSS 来创建分页： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <tit
阅读全文
摘要：总结有关按钮的各种样式 ㈠基本按钮样式 看一下没有进行css样式设计时按钮的样子与进行样式设计的按钮样子 效果图： 看，这就是两者之间的区别，接下来详细的介绍每一个样式添加后的样子。 注：cursor: pointer：光标呈现为指示链接的指针（一只手）。 ㈡按钮颜色 使用 background-c
阅读全文
