风雨渡八荒-CSDN博客

原创作用域：scope

全局作用域：全局变量es5：在function与object中生成作用域es6：在所有带{}中生成作用域：function(){} if(){} for(){} while(){}自由变量：在当前作用域调用了当前作用域不存在的变量（逐级寻找）//就近原则顶级作用域：一级作用域常见的作用域场景：全局作用域局部作用域：块级作用域 es5不支持块级作用域es6 块级作用域var：1、定义变量支持重复定义2、导致变量提升3、不支持块级作用

2022-04-12 19:11:19 135

原创 js事件与绑定事件

客户端的某个动作行为的瞬间鼠标事件:鼠标点击:onclick鼠标双击：ondbclick鼠标移入：onmouseoveronmouseenter鼠标移出:onmouseout:onmouseleave:右键右击：oncontextmenu键盘事件：按键按下：onkeydown按键抬起：onkeyup表单事件：焦点事件：获取焦点：onfocus失去焦点:

2022-04-12 19:10:20 159

原创 DOM操作：

document object model（文档对象模型）作用：动态操作html元素节点（写特效）操作html元素节点（element）：节点的样式操作：增删改查：获取当前需要操作的元素节点：Dom tree（dom树）：root element（html）document（当前文档的根节点)document.getElementById():通过id 属性获取元素document.getElementByClassName//通过class属性，

2022-04-12 19:09:20 2188

原创自定义函数：function

作用:【封装】功能模块代码(常用的功能性代码，放置在function中，代码进行复用)1、将经常使用的代码段封装成函数，提升代码复用率。2、时间的方法体（用于绑定js事件）3、作为参数（回调函数）来使用一次封装，多次调用定义自定义函数、构造函数函数声明:function hello(){ //大括号里面的称为函数体、方法体 //函数体内作用域是独立的}对象字面量方式：var fn = function(){}es6:var ..

2022-04-12 19:08:06 626

原创时间与日期与定时器

时间日期对象Date（）；date.getFullyear()年份date.getMonth()月份date.getDate()日date.getHours()0-24小时date.getMinytes()分钟date.getSeconds()秒数date.getDay()星期 0-6date.toLocalTimeString()时间字符串//时间戳:1970年1月1日00:00:00截止到现在时间所经过的秒数（js毫秒数）1s=1000ms毫秒date.getTime(

2022-04-12 19:07:30 142

原创数组:array

存储数据定义数组//定义数组并存值//索引、下标、键key索引数组：下标是从0开始的数字且连续//一维数组：存值方式；var arr = ["tom","man",22,"lol","武汉"];//语法糖var arr = new Array("tom","man",22,"lol");实例化对象来定义//二维数组：存值方式：如果数组里面的值又是数组var product = [ ["ipone12",5699,"jinse"] ["ipone12",5..

2022-04-12 19:04:29 253

原创 js中常用的系统内置函数：

typeof() 检测变量的数据类型var type = typeof str;//string//type这个变量在这里我们称为返回值//返回值：有函数（系统内置函数、自定义函数它执行后的返回的结果）console.log(type);var num = 1212412;var type = typeof(num);//numbervar bol = true；直接输出console.log(typeof(bol));js内置APIalert //js弹框pr

2022-04-12 19:03:22 1020

原创 JavaScript流程控制

流程控制ifelse嵌套if（条件）{ 条件返回值真}else{ false 执行}多分支流程控制：某个变量是否多个值的场景switch()var{ case"值": js代码段 break; case"值": js代码段 break; case"值": js代码段 break; def...

2022-04-12 19:02:29 487

原创 JavaScript基础

JavaScript类型：客户端脚本语言：动态语言支持、使用变量“弱”类型语言：隐式转换运行机制：解释性语言：一边执行一边解析（浏览器在运行过程当中进行解析）编译性语言：jsp、python、php（解析器）浏览器：html：搭建页面架构css：美化页面js：动态效果前后端分离：web前端：应用（application）的前台(html+css+js+数据渲染、交互)web后端：移动端：HYbridAPP(混合app)n

2022-04-12 19:01:39 554

原创 Flex布局

Flex 布局是什么？Flex 是 Flexible Box 的缩写，意为"弹性布局"，用来为盒状模型提供最大的灵活性。任何一个容器都可以指定为 Flex 布局。.box{display: flex;}行内元素也可以使用 Flex 布局。.box{display: inline-flex;}Webkit 内核的浏览器，必须加上-webkit前缀。.box{display: -webkit-flex; /* Safari */display: flex;

2022-04-12 18:55:32 61

原创 CSS 定位和浮动

CSS 定位 (Positioning) 属性允许你对元素进行定位。CSS 定位和浮动CSS 为定位和浮动提供了一些属性，利用这些属性，可以建立列式布局，将布局的一部分与另一部分重叠，还可以完成多年来通常需要使用多个表格才能完成的任务。定位的基本思想很简单，它允许你定义元素框相对于其正常位置应该出现的位置，或者相对于父元素、另一个元素甚至浏览器窗口本身的位置。显然，这个功能非常强大，也很让人吃惊。要知道，用户代理对 CSS2 中定位的支持远胜于对其它方面的支持，对此不应感到奇怪。另一方面，C

2022-04-07 19:38:39 126

原创 CSS列表与表格属性

列表列表项图像有时，常规的标志是不够的。你可能想对各标志使用一个图像，这可以利用 list-style-image 属性做到列表标志位置CSS2.1 可以确定标志出现在列表项内容之外还是内容内部。这是利用 list-style-position 完成的。CSS 列表属性(list)属性描述 list-style 简写属性。用于把所有用于列表的属性设置于一个声明中。 list-style-image 将图象设置为列表项标志。 list-style-p

2022-04-07 19:37:58 140

原创 CSS部分属性

背景色可以使用 background-color 属性为元素设置背景色。这个属性接受任何合法的颜色值。背景图像要把图像放入背景，需要使用 background-image 属性。background-image 属性的默认值是 none，表示背景上没有放置任何图像。背景重复如果需要在页面上对背景图像进行平铺，可以使用 background-repeat 属性。属性值 repeat 导致图像在水平垂直方向上都平铺，就像以往背景图像的通常做法一样。repeat-x 和 repeat-

2022-04-07 19:37:15 133

原创 CSS样式表

外部样式表当样式需要应用于很多页面时，外部样式表将是理想的选择。在使用外部样式表的情况下，你可以通过改变一个文件来改变整个站点的外观。每个页面使用 <link> 标签链接到样式表。<link> 标签在（文档的）头部：<head><link rel="stylesheet" type="text/css" href="mystyle.css" /></head>内部样式表当单个文档需要特殊的样式时，就应该使用内部样式表。你可以使

2022-04-07 19:35:17 88

原创 CSS与其选择器

CSS 概述 CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素样式通常存储在样式表中把样式添加到 HTML 4.0 中，是为了解决内容与表现分离的问题外部样式表可以极大提高工作效率外部样式表通常存储在 CSS 文件中多个样式定义可层叠为一 CSS 语法CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明。selector {declaration1; de

2022-04-07 19:34:37 324

原创页面框中框

框架通过使用框架，你可以在同一个浏览器窗口中显示不止一个页面。每份HTML文档称为一个框架，并且每个框架都独立于其他的框架。使用框架的坏处：开发人员必须同时跟踪更多的HTML文档很难打印整张页面框架结构标签（<frameset>）框架结构标签（<frameset>）定义如何将窗口分割为框架每个 frameset 定义了一系列行或列 rows/columns 的值规定了每行或每列占据屏幕的面积框架标签（Frame）Frame 标签定义了放

2022-04-07 19:32:17 228

原创块元素、内联元素与表单

块元素与内联元素HTML 块元素大多数 HTML 元素被定义为块级元素或内联元素。编者注：“块级元素”译为 block level element，“内联元素”译为 inline element。块级元素在浏览器显示时，通常会以新行来开始（和结束）。例子：<h1>, <p>, <ul>, <table>HTML 内联元素内联元素在显示时通常不会以新行开始。例子：<b>, <td>, <a>,

2022-04-07 19:31:24 175

原创 HTML表格与列表

表格表格由 <table> 标签来定义。每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义）。字母 td 指表格数据（table data），即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。<table border="1"><tr><td>row 1, cell 1</td><td>row 1, cell 2<

2022-04-07 19:30:29 168

原创前端初学者

HTML样式如何使用样式当浏览器读到一个样式表，它就会按照这个样式表来对文档进行格式化。有以下三种方式来插入样式表：外部样式表当样式需要被应用到很多页面的时候，外部样式表将是理想的选择。使用外部样式表，你就可以通过更改一个文件来改变整个站点的外观。<head><link rel="stylesheet" type="text/css" href="mystyle.css"></head>内部样式表当单个文件需要特别样式时，就可以使用内部样

2022-04-07 19:29:43 41

原创前段初学者

什么是 HTML？HTML 是用来描述网页的一种语言。 HTML 指的是超文本标记语言 (Hyper Text Markup Language) HTML 不是一种编程语言，而是一种标记语言 (markup language) 标记语言是一套标记标签 (markup tag) HTML 使用标记标签来描述网页 <!DOCTYPE> 声明Web 世界中存在许多不同的文档。只有了解文档的类型，浏览器才能正确地显示文档。HTML 也有多个不同的版

2022-04-07 19:28:25 39

m0_52558788的博客