- 博客(45)
- 收藏
- 关注
RSS订阅原创 JavaScript 高级
创建对象的工厂模式： function factoryPerson(name,age,action){ return{ name:name, age:age, action:action, work:work, } }方法的函数定义在外面，可以实现实例对象，对方法的共享var work = functi
2020-12-02 22:29:05
120
原创 web API、DOM、事件
API：应用程序编程接口，应用程序或开发人员可以调用的第三方应用程序或硬件提供的函数，不需要关注具体资源的源代码；web API:面向网页开发，需要调用的api;web API分类：一种时浏览器厂家提供的API BOM；一种时按ES的设计，由浏览器厂家提供的操作页面元素的API DOM；BOM常用的APIAlert() 没有返回值Prompt() 返回值为字符串Confirm() 返回值为布尔型Onload 这是个属性，取值是函数，作用页面全部加载完执行函数...
2020-11-17 15:22:50
165
原创 JavaScript内置对象
一、date1、创建日期对象1.Date() 无参；var now=new Date(); console.log(now);2.Date(字符串); //输出字符串 var date1=new Date("2020-11-4 0:33:55");//日期和时间中间用空格隔开 console.log(date1);//输出字符串3.Date(年,月,日) //Date（年，月，日） var dat..
2020-11-04 23:17:36
207
原创 JavaScript中this的指向问题，及创建对象的方式
属性和方法的定义：如果一个变量属于一个对象所有，那么该变量就可以称之为该对象的一个属性，属性一般是名词，用来描述事物的特征如果一个函数属于一个对象所有，那么该函数就可以称之为该对象的一个方法，方法是动词，描述事物的行为和功能new关键字：构造函数 ，是一种特殊的函数。主要用来在创建对象时初始化对象， 即为对象成员变量赋初始值，总与new运 算符一起使用在创建对象的语句中。注意：1、构造函数用于创建一类对象，首字母要大写2、构造函数要和new一起使用才有意义...
2020-11-01 03:33:09
484
原创 JavaScript对象
万物皆对象什么是对象：对象是一个具体的事物，一个具体的事物就会有行为和特征。JavaScript中的对象：在JavaScript中的对象其实是生活中对象的一个抽象，是无序属性的集合。其属性可以包含基本值、对象或函数。对象就是一组没有顺序的值。我们可以把JavaScript中的对象想象成键值对，其中值可以是数据和函数。对象的三大特征：1、属性 2、方法（主动的行为） 3、事件（被动的行为）也可以说对象：是由属性和行为构成。事物的特征在对象中用属性来表示。...
2020-11-01 02:26:05
54
原创 JavaScript匿名函数、作用域、预解析
匿名函数：没有名字的函数/定义时未直接命名的函数。优点：非匿名函数在定义时，已经创建了函数对象和作用域对象；所以，即使没有调用也会占用内存空间；但是匿名函数仅在调用时，才临时创建函数对象和作用域链对象；调用完会马上释放，所以匿名函数比非匿名函数更节省内存空间，定义一个匿名函数即自调函数。如何声明一个匿名函数： //匿名函数的声明 (function(){函数执行体})();匿名函数如何使用：将匿名函数赋值给一个变量，这样可以通过变量进行调用。匿名函数自调用自
2020-10-31 23:48:00
675
原创 JavaScript-arguments对象粗解
1、arguments的使用JavaScript中，arguments对象是比较特别的一个对象，实际上是当前函数的一个内置属性。也就是说所有函 数都内置了一个arguments对象（是每一个函数里的内置的对象），arguments对象中存储了传递的所有的实参。arguments是一个伪数组，因此及可以进行 遍历（arguments对象可以进行遍历）。案例：1.任意个数的一组数中的最大值。代码如下：<!DOCTYPE html><html lang="en"&
2020-10-31 17:35:43
150
原创 JavaScript之开篇
Web网站: 三大技术(1)HTML(骨骼): 设计网站基本结构; 超文本标记语言(2)CSS(肉体): 对于结构一种美化/装饰; 层叠样式表(3)JavaScript(JS)(灵魂): 提供了用户和界面之间的一种交互行为;JavaScript介绍:JS是运行在客户端(浏览器)的脚本语言,是基于事件驱动的弱类型的脚本语言; 浏览器的内核: 渲染引擎和JS引擎脚本语言:是一种解释型的语言，解释性语言是指它常用的执行机制是使用一个“解释器”来执行，解释器对于程序是一句一句“翻译”成.
2020-10-26 09:26:33
528
2
原创 C3 弹性盒子2
align-self：用于设置弹性元素自身在侧轴（纵轴）方向上的对齐方式。align-self属性取值 auto 如果'align-self'的值为'auto'，则其计算值为元素的父元素的'align-items'值，如果其没有父元素，则计算值为'stretch'。 flex-start 弹性盒子元素的侧轴（纵轴）起始位置的边界紧靠住该行的侧轴起始边界。 flex-end 弹性盒子元素的侧轴（纵轴）起始位置的边界紧靠住该行的侧轴结束边界。 center 弹性盒子元素
2020-10-23 20:26:30
107
原创 C3-弹性盒子1
弹性盒子（ Flexible Box 或 flexbox）弹性盒子是 CSS3 的一种新的布局模式，是一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有恰当的行为的布局方式。引入弹性盒布局模型的目的是提供一种更加有效的方式来对一个容器中的子元素进行排列、对齐和分配空白空间。弹性盒子的组成（弹性盒子内可包含一个或多个弹性元素）：弹性容器(Flex container) 弹性子元素(Flex item)原先我们制作网页时，经常会遇到一个容器里嵌套多个div层，为了让div层横向排列，在没
2020-10-22 23:57:32
310
原创 C3 多列布局
C3 可以将文本内容设计的像报纸一样的多列布局如下图所示：C3多列的一些属性： column-count column-count属性指定了需要分割的列数。 column-gap column-gap属性指定了列与列间的间隙。 column-rule-style column-rule-style属性指定了列与列间的边框样式 column-rule-width column-rule-wi...
2020-10-22 22:08:36
251
原创 CSS定位（相对定位和绝对定位）
我们可以使用 css 的 position 属性来设置元素的定位类型，postion 的设置项如下：相对定位：relative生成相对定位元素，元素所占据的文档流的位置不变，元素本身相对文档流的位置进行偏移（相对于原先自己本身一个位置的偏移）绝对定位：absolute生成绝对定位元素，元素脱离文档流，不占据文档流的位置，可以理解为漂浮在文档流的上方，相对于上 一个设置了相对或者绝对或者固定定位的父级元素来进行定位（父相子绝-父元素设置相对定位，子元素设置绝对定位），如果找不到...
2020-10-20 16:51:07
144
原创 CSS浮动与清除浮动
文档流：文档流，是指盒子按照 html 标签编写的顺序依次从上到下，从左到右排列，块元素占一行，行内元素在一行之内从 左到右排列，先写的先排列，后写的排在后面，每个盒子都占据自己的位置。浮动的特性：浮动元素有左浮动(float:left)和右浮动(float:right)两种 ：右有浮动文字会倒过来，所有需要把编写顺序倒过来即可。 浮动的元素会向左或向右浮动，碰到父元素边界、浮动元素、未浮动的元素才停下来： 相邻浮动的块元素可以并在一行，超出父级宽度就换行 。如图： 浮动让行内元素或块元素自动转化
2020-10-14 21:08:28
110
原创 CSS内联块和内联元素缝隙问题解决办法
如图：转换为（display-inline-block)内联块元素之后，两个元素之间多了一条为5px的缝隙(根据需求有时需要有时不需要），解决办法：margin-left:-5px（元素多的话，每个都需要设置） 给其父元素添加一个样式：font-size:0;(但是对于父元素里包含的字体则会消失，所以需要给父元素内需要设置字体样式的内联元素单独设置字体样式） 去掉内联元素之间的换行（如下图）：...
2020-10-14 19:50:23
471
原创 css-块元素、内联元素、内联块元素
元素就是标签，布局中常用的有三种标签，块元素、内联元素、内联块元素，了解了这三种元素的特性，才能熟练的对页面进行布局。1.块元素块元素（会占据文档流一行显示），也可以称为行元素，布局中常用的标签如：div、p、ul、li、h1~h6、dl、dt、dd、ol 等等都是块元素。，它在布局中的行为：支持全部的样式。如果没有设置宽度，默认的宽度为父级宽度 100% 盒子占据一行、即使设置了宽度同样也是父级宽度100%。如图，两个div各自占据一行。块元素转换为内联元素。display:inlin
2020-10-12 21:42:41
643
原创 css元素溢出问题
当子元素的尺寸超过父元素的尺寸时，需要设置父元素显示溢出的子元素的方式， 设置的方法是通过 overflow 属性 来设置。问题如下：overflow 属性:1、visible 默认值。内容不会被修剪，会呈现在元素框之外。如上图所示！2、hidden 内容会被修剪，并且其余内容是不可见的，此属性还有清除浮动、清除margin-top 塌陷的功能。3、scroll 内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。4、auto 如果内容被修剪，则浏览器会显示滚动条以便查看其余的内.
2020-10-12 20:28:54
1631
原创 CSS-合并/塌陷
margin相关1.设置元素水平居中：margin:x auto;(X代表上下位置，auto代表左右-水平居中）2.margin 负值使元素位置及边框合并3.设置文字垂直居中：line-height4.一般制作网页时，需要设置margin(外边距-margin相对于上一个元素，如下图）：0；padding(内边距）：0；5.外边距合并（只存在于垂直的两个盒子之间产生的关系）-外边距合并指的是，当两个垂直外边距相遇时，它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的 外边距
2020-10-12 19:58:34
164
原创 HTML框架+CSS选择器
margin:外边距padding:内边距<ul>：去掉<li>前面的实心圆点<a>:text-decoration:none 去掉超链接下划线<font-family>:字体/宋体、仿宋，隶书，楷书、小篆等等。受限于本地已安装字体HTML框架（frameset)-不常用,用来锻炼逻辑frameset标签替代了页面中的body标签使用了frameset框架就替代了body，这个时候不能直接编写标签或者文本。此时应当给每一个横向或者纵
2020-09-30 16:49:14
132
原创 HTML（复习）
开发即面向对象开发，万事万物皆可为对象。对象【属性，方法，事件】例如：person:name 、age、sex、ID.....1、介绍HTML（Hypertext Markup Language）即超文本标记语言，只有浏览器可以解析的语言。浏览器一般由（js引擎，和渲染引擎构成），而解析HTML是由渲染引擎负责。超文本：意为除了文本之外，还包括视频，音频，链接，图片，列表和表格等等标记语言是指由标签组成的语言，有两种类型：双标签<标签名称1> <标签名称1/&g
2020-09-28 22:43:49
109
原创 CSS边框的一些应用
分享一些CSS边框的应用案例扇形：.img{ width: 500px; height: 250px; background: url(img/37317-106.jpg)no-repeat; background-size: 500px 250px; border: 2px solid black; border-radius: 250px 250px 0px 0px; }正方体异型：.ban{ width: 200p
2020-09-27 21:24:00
122
原创 CSS3的总结
一、CSS 的概述CSS 指层叠样式表 (Cascading Style Sheets) 样式定义如何显示 HTML 元素样式通常存储在样式表中把样式添加到 HTML 4.0 中，是为了解决内容与表现分离的问题外部样式表可以极大提高工作效率外部样式表通常存储在 CSS 文件中多个样式定义可层叠为一。二、CSS解决了什么问题HTML 标签原本被设计为用于定义文档内容。通过使用 <h1>、<p>、<table> 这样的标签，HTML 的初衷是表达“这是标...
2020-09-25 19:49:32
224
原创 HTML5一些心得
一、H5新增得语义化标签1.什么是语义化？即标签有了自己得含义，我们通过标签就能判断内容。2.语言话标签有什么好处？ 使得HTML页面结构更加明了清晰，且可读性增加，又便于团队的维护和开发。而且，更加有利于搜索引擎或者辅助设备理解 HTML页面的内容，这样搜索引擎可根据标签语言确定上下文、权重的关系。二、H5常用的一些语义化标签<header>：定义页面或内容的头部区域;<nav>：定义页面导航;<main>...
2020-09-25 19:08:39
178
原创 jQuery4
jQuery--AJAX简介1.ajax是与服务器交换数据的技术，它在不重载全部页面的情况下，实现了对部分网页的更新。load() 从服务器加载数据，并把返回的数据放置到指定的元素中 语法$(selector).load(url,data,fuction(response,status,xhr))url 必需，规定需要加载的url。 data 可选，规定连同请求发送到服务器。 function(reponse,status,xhr) 可选。规定lo
2020-09-18 17:19:09
53
原创 jQuery3
jQuery3一.jquery HTML1.jQuery添加元素append() 在被选中元素中插入内容【由下往上】 prepend() 在被选中元素中插入内容【由上往下】 after() 在被选元素之后插入内容 before() 在被选元素之前插入内容<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <s
2020-09-17 19:51:20
68
原创 jQuery2
一.jQuery效果1.jQuery隐藏和显示1.1 javascript控制隐藏和显示通过CSS样式的display属性<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script> window.onload=function(){ document.getElementById("b
2020-09-16 21:02:28
75
原创 jQuery1
https://www.runoob.com/jquery/jquery-tutorial.html1.jQuery是一个JavaScript库。【js】2.jQuery极大地简化了JavaScript编程。3.jQuery很容易学习。JQuery简介jQuery库可以通过一行简单的标记被添加到网页中。<script src="js/query.js"></script>您需要具备的基础知识在开始学习jQuery之前，应该对以下知识有基本的了解：.
2020-09-15 22:33:53
96
原创 JavaScript11
总结下步骤1.首先创建HttpRequest对象我们需要判断浏览器，不同的浏览器创建这个HttpRequest对象的时候，是使用的对象不同window.XMLHttpRequest---IE7+,Firefox,Chrome,Opera,Safari浏览器---XMLHttpRequest---IE5,IE6浏览器---ActiveObject("Microsoft XMLHTTP");2.请求发送以后的处理动作XMLHttpRequest对象属性 属性
2020-09-14 21:02:25
108
原创 JavaScript10
https://www.w3school.com.cn/js/index.asp总结步骤1.创建HttpRequest对象我们需要判断浏览器，不同的浏览器创建HttpRequest对象的时候，是使用的对象不同window.XMLHttpRequest--IE7+,firefox,Chrome,Opera,Safari浏览器--XmlhttpRequest---IE5，IE6浏览器--ActiveXobject（"Microsoft.XMLHTTP");2.请求发送以后的处理动作XML
2020-09-12 13:08:19
93
原创 JavaScript
https://www.w3school.com.cn/js/index.asp1.JavaScript异步编程[JavaScript AJAX]什么时候用异步编程在前端编程中（甚至后端有时也是这样），当一个事件没有结束时，界面将无法处理其他请求。现在有一个按钮，如果我们设置他的onclick事件为一个死循环，那么当这个按钮按下，整个网页都会失去响应。为了避免这个情况的发生，我们常常用子线程来完成一些可能消耗时间足够长以至于被用户察觉的事情，比如读取一个大文件或者发出一个网络请求。因为子
2020-09-10 19:57:44
115
原创 JavaScript8
https://www.w3school.com.cn/js/index.asp1.JavaScript:Browser BOMBOM--浏览器对象模型1.1JavaScript window对象所有浏览器都支持window对象，它代表浏览器的窗口。所有全局JavaScript对象，函数和变量自动成为window对象的成员。<!DOCTYPE html><html> <head> <meta charset="utf-8">.
2020-09-09 21:21:16
126
原创 JavaScript7
https://www.w3school.com.cn/js/index.asp1.JavaScriptHTML DOMHTML--html标记JavaScript---JavaScript对象/变量我们现在需要通过JavaScript来改变html来改变html标记所呈现的样子/样式/位置等等。那么我们就需要将html标记转换成javascript对象将html标记转换成javascript对象--html DOM对象DOM（文档对象模型）当网页被加载时，浏览器会创建页面的文档
2020-09-08 21:48:49
116
原创 JavaScript6
https://www.w3school.com.cn/js/index.asp1.JavaScript条件判断语句在JsvsScript中，我们可使用如下条件语句：1.if（判断条件）{被执行的Javascript代码块}2.if（判断条件）{被执行的Javascript代码块1}else{被执行的Javascript代码块2}3.if(判断条件1）{被执行的JavaScript代码块1}else if（判断条件2）{被执行的Javascript代码块2}...else
2020-09-05 21:01:42
262
原创 JavaScript-5
https://www.w3school.com.cn/js/index.asp1.JavaScript数组数组就是能够一次保存多个数据值的变量。var a =100; var b="hello";var c=[100,"hello"]; //数组1.1数组的创建格式1：var arr=[数据值1，数据值2.....数据值n);格式2：var arr=new Array();var arr=new Array(数据值1，数据值2，...数据值n);以...
2020-09-04 19:53:32
78
原创 JavaScript4
1.JavaScript数字javascript只有一种数值类型。[没有整数和小数之分]实例:var x=3.14 //带小数点的数值var y=3 //不带小数点的数值超大或超小的数可通过科学计数法来写：var x=123e5; //12300000var y=123e-5 //0.00123javascript数值始终以双精度浮点数来储存。整数（不适用指数或者科学计数法）会被精确到15位。小数的最大数是17位，但是浮点的算数并不总是100%精准。v
2020-09-03 20:26:42
147
原创 JavaScript-3
https://www.w3school.com.cn/js/index.asp1.JavaScript事件HTML事件是发生在HTML元素上的“事情”。当在HTML页面中使用JavaScript时，JavaScript能够“应对”这些事件。通过JavaScript代码，向HTML元素添加事件处理程序。格式1：<html 元素事件名称=”javascript代码对应事件的处理程序“><input type="button" balue="按钮”onclick="
2020-09-02 17:22:45
112
原创 JS初识2
JavaScript_2https://www.w3school.com.cn/js/index.asp1.JavaScript 运算符1.1JavaScript 使用(=)赋值运算符。JavaScript 使用算数运算符（+ - * / % ++ --）来计算值。<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>变量-运算符-表达式&...
2020-09-01 16:18:35
51
原创 JS初试
一、为何学习JS（JavaScript)JavaScript：是web开发者必学的三种语言之一；HTML是定义网页内容--【制作网页】--单纯使用HTML制作的网页缺少美感CSS是规定了网页的布局和样式--【美化网页】但HTML+CSS制作的网页缺乏动态效果【界面无动态，数据无动态】所以，需要JavaScript对网页进行编程【添加动态效果，数据动态加载】二、什么是JavaScript?1.JavaScript和java是两种完全不同的语言，不论概念上还是设计上。1.1Jav
2020-08-29 18:00:59
78
原创 CSS的基本属性3
一、CSS的基本属性3Transition---复合属性[检索或设置对象变换时的过渡。]<' transition-property '>： 检索或设置对象中的参与过渡的属性none： 不指定过渡的css属性 all： 所有可以进行过渡的css属性 自定义属性：指定要进行过渡的css属性 <' transition-duration '>： 检索或设置对象过渡的持续时间时长:指定对象过渡的持续时间 [单位s秒]<' transition-timi
2020-08-27 17:20:40
104
原创 CSS的基本属性2
一、CSS的基本属性21.表格属性 属性名称 用途 取值 border-collapse 设置或检索表格的行和单元格的边是合并还是独立。 separate： 边框独立 collapse： 相邻边被合并 border-spacing 边框独立时，单元格与单元格之间的间距 数字，不允许负值 .
2020-08-26 19:21:33
85
原创 CSS的基本属性
一、CSS的基本属性之前对CSS做了一个基本的了解今天继续深入的学习CSS的基本属性1.修饰文本的样式属性 属性名称 属性的作用 属性的取值 text-transform 文本转换大小写 None:capitalize:Uppercase： Lowercase text-align 元素内容的水平对齐方式。
2020-08-25 14:57:00
266
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人