11 2021 档案
摘要：水平居中： ①行内元素(或行内块元素)包含在块元素里时可将元素看作是父元素中的文本，父元素(块元素设置text-align:center;) ②1.块元素定宽时，设置margin: auto;即可实现水平居中 ②2.块元素定宽时，设置position定位实现水平居中 垂直居中： 对应① 设置heig
阅读全文
摘要：为什么需要定位？ 1.某个元素可以自由的在一个盒子内移动位置，并且压住其他盒子。 2.当我们滚动窗口的时候，盒子是固定屏幕某个位置的。 浮动可以让多个块级盒子一行没有缝隙排列显示，经常用于横向排列盒子。 定位则是可以让盒子自由的在某个盒子内移动位置或者固定屏幕中某个位置，并且可以压住其他盒子。 定位
阅读全文
摘要：清除浮动本质： 清除浮动本质是清除浮动元素脱离标准流造成的影响 如果父盒子本身有高度，则不需要清除浮动 清除浮动之后，父级就会根据子盒子自动检测高度。父级有了高度，就不会影响下面的标准流了。 清除浮动语法：选择器{clear: 属性值;} 属性值 描述 left 不允许左侧有浮动元素(清除左侧浮动的
阅读全文
摘要：它们的主要用法： 1.offset系列经常用于获得元素位置 offset offsetTop 2.client系列经常用于获取元素大小clientWidth clientHeight 3.scroll系列经常用于获取流动距离scrollTop scrollLeft 注意：页面滚动的距离是通过wind
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> div { width: 200px; height: 200px; background-color: pink
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> div{ width: 100px; height: 100px; background-color: #FFC0
阅读全文
摘要：offset概述：offset翻译是偏移量，使用offset系列相关属性可以动态的得到该元素的位置(偏移)、大小等。 · 获得元素距离带有定位父元素的位置 · 获得元素自身的大小(宽度高度) 注意：返回的数值都不带单位 offset系列属性 作用 element.offsetParent 返回作为该
阅读全文
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi
阅读全文
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi
阅读全文
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <a href="定时器案例.html">去定时器案例</a> <button>前进</button> <script> //nav
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <button>点击</button> <div></div> <script> //window对象给我们提供了一个locatio
阅读全文
摘要：JS是单线程 同一个时间只能做一件事。 单线程意味着所有任务需排队会导致JS执行时间过长，会造成页面渲染不连贯，页面渲染加载阻塞的感觉 同步和异步：为了解决这个问题，利用多核CPU的计算能力，HTML5允许JavaScript脚本创建多个线程。于是，JS中出现了同步和异步。（JS还是单线程哦！！）
阅读全文
摘要：this指向在函数定义时是确定不了的，只有函数执行的时候才能确定this指向。一般情况下this的最终指向是那个调用它的对象。 1.在对象方法中，this指向方法的调用者 e.g. var o = { sayHi: function() { console.log(this);//this指向的是o
阅读全文
摘要：window对象提供了两种定时器：setTimeout()和setInterval() 1.setTimeout()定时器 window.setTimeout(调用函数,[延迟的毫秒数]); 用于设置一个定时器，该定时器在定时器到期后执行调用函数 注意点: ①window可省略 ②延迟时间单位是毫秒
阅读全文
摘要：BOM(Browser Object Model)提供了独立于内容而与浏览器窗口进行交互的对象，其核心对象是window。 JavaScript的标准组织是ECMAScript，DOM标准化组织是W3C，而BOM缺乏标准，是Netscape浏览器标准的一部分。 BOM由一系列相关的对象构成，并且每个
阅读全文
摘要：1.百度换肤案例 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> * { margin: 0; padding: 0; } body { background:
阅读全文
摘要：JavaScript使我们有能力创建动态页面，而事件是可以被JavaScript侦测到的行为。 网页中的每个元素都可以产生某些可触发JavaScript的事件。 事件三要素：事件源（事件被触发的对象），事件类型（如何触发什么事件），事件处理程序（通过一个函数赋值的方式完成）。 执行事件步骤：1.获取
阅读全文
摘要：对于JavaScript，为了能够使JavaScript操作HTML、JavaScript就有了一套自己的dom编程接口 对于HTML，dom使得html形成一棵dom树。包含文档、元素、节点 我们获取过来的DOM元素是一个对象（object），所以称为文档对象模型 关于dom操作，我们主要针对于元
阅读全文
摘要：文档对象模型(Document Object Model)，是W3C阻止推荐的处理可扩展标记语言(HTML或者XML)的标准编程接口。W3C已定义了一系列的DOM接口，通过这些DOM接口可以改变网页的内容、结构和样式。 获取页面元素的方法：1.根据id获取(getElementById()获取元素)
阅读全文
摘要：简单类型又叫做基本数据类型或者值类型。 复杂类型又叫做引用类型。 ·值类型：简单数据类型/基本数据类型，在存储时变量中存储的是值本身，因此叫做值类型。 string、number、boolean、undefined、null(返回空对象) 如果有个变量，我们以后打算存储为对象，暂时没想好放啥，这时候
阅读全文
摘要：JS中对象分为3种：1.自定义对象 2.内置对象 (1、2都是JS基础对象，属于ECMAScript) 3.浏览器对象(JS独有的)。 内置对象就是指JS语言自带的一些对象，这些对象供开发者使用，并提供了一些常用的或是最基本而必要的功能(属性和方法)。 最大的优点：帮助我们快速开发。 JS提供了多个
阅读全文
摘要：对象是一个具体的事物。 在JS中，对象是一组无序的相关属性和方法的集合，所有的事物都是对象，例如字符串、数值、数组、函数等。 对象由属性和方法组成。 属性：事物的特征(名词) 方法：事物的行为(动词) 创建对象(object)的三种方式：1.利用字面量创建对象 var obj={ name:XY,
阅读全文
摘要：JS作用域：就是代码名字(变量)在某个范围内起作用和效果。 (es6即es2015)之前分为：全局作用域和局部作用域(函数作用域)。 全局作用域： 直接编写在 script 标签之中的JS代码，都是全局作用域； 或者是一个单独的 JS 文件中的。 全局作用域在页面打开时创建，页面关闭时销毁； 在全局
阅读全文
摘要：函数就是封装了一段可以被重复执行调用的代码块。 目的：让大量代码重复使用。 函数在使用时分为两步：1.声明函数 1 function 函数名(){ 2 //函数体 3 } 2.调用函数(函数不调用不执行) 函数名(); 我们可利用函数的参数实现函数重复不同的代码： 1 function 函数名(形参
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>自增自减</title> <script type="text/javascript"> var d = 20; console.log(d--);//20 var d = 20;
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script type="text/javascript"> /*通过程序,在页面中输出如下图形: * ** *** **** ***** ***** ****
阅读全文
摘要：保存一个值，可用变量保存一组值（多个值），可使用数组保存一个人物的完整信息，可使用对象（JS中对象表达结构清晰，强大）。 变量需要先声明再赋值，声明变量本质是去申请空间。数组的两种创建方式：1.利用new创建数组 var 数组名=new Array();//创建一个新的空数组 2.利用数组字面量创建
阅读全文
摘要：JS是运行在客户端的脚本（script）语言。脚本语言–不需要编译，运行过程中由JS解释器（JS引擎）逐行来进行解释并执行。解释型语言好比吃火锅，边吃边涮，同时进行编译型语言先把所有菜做好，才能上桌吃饭。 浏览器执行JS过程：浏览器分为两部分：渲染引擎和JS引擎渲染引擎用来解析HTML和CSS，俗称
阅读全文
浙公网安备 33010602011771号