自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(28)
  • 收藏
  • 关注

原创 JS---delete关键字

delete关键字虽然JS有自己的垃圾回收机制,因此delete用的时候不是很多,但是了解一下也还是有好处的,比如在面试题可能会遇到。首先先把1.删除对象的属性 语法:delete 对象.属性2.可以删除没有使用var关键字声明的全局变量(直接定义在window上面的属性)3.删除数组元素4.不能删除内置对象的属性5.不能直接删除从原型上继承的属性需要注意的是:1.返回值类型为布尔值(true / false),删除成功返回true2.删除对象中不存在的属性,返回值是true3.删除对象

2021-05-30 20:17:08 1293

原创 JavaScript模板引擎Template.js使用

文章主要为大家详细介绍了JavaScript模板引擎Template.js使用方法。template.js 一款 JavaScript 模板引擎,简单,好用。提供一套模板语法,用户可以写一个模板区块,每次根据传入的数据,生成对应数据产生的HTML片段,渲染不同的效果。特性1.性能卓越,执行速度通常是 Mustache 与 tmpl 的 20 多倍2.支持运行时调试,可精确定位异常模板所在语句。3.对 NodeJS Express 友好支持。4.、支持预编译,可将模板转换成为非常精简的 js 文件。

2021-05-30 19:12:35 611

原创 如何用jQuery发送ajax请求

什么是AjaxAjax 即“Asynchronous Javascript And XML”(异步 JavaScript 和 XML),是指一种创建交互式网页应用的网页开发技术。通过在后台与服务器进行少量数据交换,Ajax 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。ajax的基本结构 $(function(){ //请求参数 var list = {}; // $.ajax({

2021-05-23 21:45:09 393

原创 JS里如何实现防抖以及案例的实现

防抖防抖的定义:在短时间内如果触发了同一事件,都会重置计时器,等到事件不触发了,再等待规定事件,才会再执行函数。(简单的理解就是在某个时间期限内事件函数只会执行一次)主要实现:利用seTtimeout来实现计时器的效果,下面来一个案例看看防抖的是实现(看看一个表单是怎么实现防抖的)<!-- 先来两个表单元素 --> <input type="text"> <input type="submit" id="ipt">js的代码: <scr

2021-05-22 18:46:00 567

原创 JS中关于this指向问题

当我们使用JavaScript开发的时候,有时候会遇到this的指向的问题。而且在面试题的时候,也会经常问到这个知识点,比如call,bind的this,箭头函数的this。今天就来讲讲这个this指向的问题,先记住最主要的一句:哪个对象调用函数,函数里面的this就指向这个对象。这里先做个思维大纲:1.作为对象的属性调用–this指向这个对象2.作为普通函数被调用–this总是指向全局对象(浏览器中通常为window);在严格模式下:this指向undefined3.作为构造器调用:通常情况下,t

2021-05-16 16:46:30 117

原创 JS几种常见的报错类型

JS的几种报错类型js的控制台的报错类型主要分为两大类,一种是语法错误,这种错误直接就会导致js文件无法执行;另外一种是报错异常,这种错误会使之后的代码无法执行,但是之前的代码运行不受影响。下面分别来讲解。SyntaxErrorSyntaxError(语法错误)var a; //Uncaught SyntaxError: Invalid or unexpected token 变量名错误 console.log 'b'); //Uncaught SyntaxError: Unexpected

2021-05-15 21:57:03 1691

原创 ES6的解构赋值

解构赋值首先来看看在ES6里面数组的解构1、本质上,这种写法属于“模式匹配”,只要等号两边的模式相同,左边的变量就会被赋予对应的值。let [x,...y] = [1,2,3,4]x //1y //[2,3,4]解构不成功的情况:let [foo] = []foo //undefined...

2021-05-09 22:23:49 68

原创 ES6中两种定义变量的方式const和let

let与constES6 新增加了两个重要的 JavaScript 关键字: let 和 const。let 声明的变量只在 let 命令所在的代码块内有效。const 声明一个只读的常量,一旦声明,常量的值就不能改变。letlet声明:块级作用域let跟var作用类似,但是有很大的区别就是一个块级作用域,而var声明的范围是函数作用域。也就是说let声明的变量只在它所在的代码块有效。for (let i = 0; i < 10; i++) { console.log(i);}con

2021-05-09 22:02:59 339

原创 关于ajax发送请求以及get与post的区别

ajax发送请求首先先来点文字简述下五大步:(1)创建异步对象。即 XMLHttpRequest 对象。(2)使用open方法设置请求的参数。包括:请求的方法、请求的url。(3)设置请求头(4)注册事件。 onreadystatechange事件,状态改变时就会调用。如果要在数据完整请求回来的时候才调用,我们需要手动写一些判断的逻辑。(5)用send方法发送请求。接下来就是把这五句代码分别用代码给你们实现出来 // 1. 创建请求对象 var xhr = new XML

2021-04-25 23:48:43 417

原创 CSS中如何使用高斯模糊

高斯模糊1.首先高斯模糊的用法很简单 用法:添加属性:-webkit-filter(这个是Google Opera): 属性名(属性值);filter()函数接受两个参数://其中是指一个图像,是一个过滤器。filter(<url>, <filter-function-list>)div { background: filter(url(path/to/img.jpg), blur(5px)); }知道了用法来个简单的案例先看看效果图<!DOC

2021-04-19 20:57:35 1168

原创 VSCode设置自定义背景的三种方法

第一种方法1.在插件栏下载background插件2.选第一个安装后 点击这个扩展设置3.点击这个Background:style 在setting.json中设置插入这段代码{ /** 编辑器背景 */ "window.titleBarStyle": "custom", //首先把标题栏改为非原生的 "background.enabled": true, "background.useDefault": false, "background.cust

2021-04-08 19:28:02 30643 10

原创 用H5标签写视频控件

播放暂停首先就是播放暂停功能play.onclick=function(){ // 判断视频是否是暂停状态 这个值是true if(ovideo.paused){ // .play是播放的方法 ovideo.play() this.innerHTML='暂停'; }else{ // 这个是暂停的方法 ovideo.pause(); this.innerHTML='播放'; }

2021-04-05 22:42:57 155

原创 关于JS中this的指向问题

this是什么1.this实际是在函数被调用时才发生的绑定,也就是说this具体指向什么,取决于你是怎么调用的函数。this的四种基本用法1.在一般函数方法中使用 this 指代全局对象2.作为对象方法调用,this 指代上级对象3.作为构造函数调用,this 指代new 出的对象4.apply 调用 ,apply方法作用是改变函数的调用对象,此方法的第一个参数为改变后调用这个函数的对象,this指代第一个参数第一种是默认绑定的方式,因为函数直接调用。没有应用其他的绑定规则,这里进行了默认绑定

2021-04-04 20:10:22 79

原创 JS同步加载以及异步加载的三种方式

JS同步加载同步加载就是一种我们最常用的一种方式。这种加载方式带来的一种影响就是会导致页面阻塞。因为js中有输出document内容、修改dom、重定向等行为,就会造成页面堵塞。所以建议是把script标签写在body的后面。尽量避免这种阻塞带来的影响。异步加载1.defer的用法-以前适用于IE,写在可以在主流浏览器上使用。 <script src="test.js" defer></script>defer可以直接在script标签上使用。他的属性值也就他自己一个,所

2021-04-04 16:43:27 2582

原创 JavaScript的四种基本继承方式

## 标题第一种继承,原型链继承(子类继承父类) function Father(){ this.firstName = 'shuai' } var father = new Father(); Father.prototype.lastName = 'wang'; function Son(){ this.firstName = 'ming'; this.sex =

2021-03-14 22:17:01 94

原创 原型链简要分析

原型链首先要清楚的是prototype创建的每个函数都有一个prototype(原型)属性,这个属性是一个指针,指向一个对象,而这个对象的用途就是包含可以由特定类型的所有实例共享的属性和方法。好处就是:不必在构造函数中定义对象实例的信息,而是直接将这些信息添加到原型对象上__proto即是隐式原型 。1.每一个实例对象都有一个私有属性 proto ,该私有属性总是指向实例构造函数的原型对象;2.同的原型对象”节点“通过 proto 指向进行串联连接,从而形成一条原型链。注意:1.函数就是

2021-03-07 20:00:20 154

原创 全局与函数的预编译

预编译首先是全局预编译 三步第1步. 创建一个GO对象 Global Object第2步. 将var关键字声明的变量当作GO对象的属性,赋值为undefined,有重名的直接覆盖第3步. 将function关键字声明函数 当作GO对象的属性,值为函数体,重名直接覆盖。 console.log(i); var i = 30; console.log(i); function i() { } var i = function () { }

2021-03-07 19:09:53 172

原创 用JS循环写阶乘相加,斐波那契数列

阶乘相加1!+2!+3!+4!…n!首先清楚阶层是什么5的阶乘是1x2x3x4x5清楚了这个就简单了用循环能很清晰的做这个题 <script> var n = Number(prompt("请输入一个数")); // 1.首先是定义一个jc为1的变量,2.每次循环后这个阶乘都会随着i值的变化, // 3.再来个sum来接收每一个阶乘的相加 这是重点~~~ var jc = 1; var sum = 0

2021-01-25 19:48:06 350 1

原创 用JS的for循环写长方形,直角三角形,等腰三角形

长方形首先来看看长方形看看一个for循环能画一行*的效果 for(var j = 0;j<5;j++){ document.write("*") }那么怎么输出多行这五个星号呢。这时候可以再套一个for循环 for (var i=0;i<5;i++){ for(var j = 0;j<5;j++){ document.write("* ") }document.wri

2021-01-21 20:57:00 1900

原创 如何用JS算水仙花数

水仙花数首先要知道什么是水仙花数水仙花数也被称为超完全数字不变数或阿姆斯特朗数,水仙花数是指一个 3 位数,它的每个位上的数字的 3次幂之和等于它本身(例如:1^3 + 5^3+ 3^3 = 153)。搞懂了上面那个例子,其实就简单了那么该怎么求水仙花数呢1.水仙花数是指一个 3 位数2.它的每个位上的数字的 3次幂之和等于它本身一个三位数就先把这个区间的所有三位数输出来其次分别求出这个三位数的百位,十位,个位怎么求?这个数与10的模就是个位这个数除以10 然后与10的模就是十位这个

2021-01-18 19:15:16 781

原创 用CSS3设计照片墙

照片墙首先来看看效果这个墙可以环绕起来 并转动首先清楚一下思路第一步:可以将这八张照片叠起来第二步:用CSS3设置3d空间第三步:分别将这八张图片在3d空间里沿着父级的Y轴分别旋转45,90,135度…(因为360度里分八份)。第四步:做到这一步会发现,这八张图虽然已经转开,但是还没有彼此产生间距,这个时候用transform属性的translateZ属性将每个图里父级的距离移开,就会形成这个照片墙。第五步:给父级设置关键帧动画,就可以将整个照片墙旋转起来。就下来进行代码展示:第一步:

2021-01-03 22:08:26 499

原创 浮动的讲解

浮动是什么?浮动。什么是浮动?元素的浮动是指设置了浮动属性的元素会脱离标准普通流的控制,移动到其父元素中指定位置的过程。浮动可以用来干什么:浮动是CSS布局的利器,我们可以通过浮动来灵活地定位页面元素,以达到布局网页的目的。语法:float: 取值;三种取值方式再来举例看看怎么用的这是正常的一个父级元素里面正常排列三个子元素效果展示然后看看我们给父级样式里加入float:left这个语法后再来看看效果效果如下可以看到这多个块级元素不再每个横向排列独占一行。而是全部紧挨着横向排

2020-12-28 21:00:37 354

原创 如何用css画爱心

如何用CSS画爱心首先要清楚爱心是怎么组成的:其实就是由两个圆和一个正方形组成的。了解了这个思想下面就开始来画圆。首先在body搭建基本的结构代码如下:思路就是用个父级把这两个圆和正方形套起来,稍后还会用到这个父级。第二步:用CSS样式来渲染。首先用规范的写法,用通配符*{padding:0 margin:0;}把当前的页面所有元素的内外边距去掉。第二步给这个父级宽高,能更清楚的看见里面的元素,而且利用父级的属性给其加上相对定位, position: relative;再把每个子集加上绝对定位

2020-12-27 18:51:47 441 2

原创 CSS选择器拓展

后代选择器后代选择器,就是选中某个元素下的子元素,然后对该子元素设置CSS样式。(父元素与子元素必须用空格隔开,从而表示选中某个元素下的子元素。)用法:浏览器展示效果:说明分析:“#father1 div{…}”表示选择“id为father1的元素”下的所有div元素;“#father2 #p1{…}”表示选择“id为father2的元素”下的子元素,其中子元素的id为#p1。因为“id为father2的元素”下的第2个p元素没有被选中,所以第2个p元素内容没有变成红色。子代选择器写

2020-12-21 19:59:59 115

原创 CSS的引入与基础选择器讲解

CSS的简介首先要了解CSS是什么。CSS,即“Cascading Style Sheet(层叠样式表)”,是用来控制网页的外观的一门技术。HTML、CSS和JavaScript是前端技术中最核心的三个元素。HTML控制网页的结构,CSS控制网页的外观,而JavaScript控制网页的行为。CSS的引入方式在HTML中引入CSS共有3种方式:(1)外部样式表;(2)内部样式表;(3)行内样式表;1.外部样式表外部样式表是最理想的CSS引用方式,在实际开发当中,为了提升网站的性能和维护性,一

2020-12-19 13:47:40 212 1

原创 零基础小白三天学会基础HTML---day3

HTML表格概述表格在网页制作中用得很多在制作网页时,使用表格可以更清晰地排列数据。在过去的web1.0时代,表格更多地用在网页布局定位上。但是在web2.0时代,表格定位已经被摒弃了,现在使用的是“DIV+CSS”模式。下面来学习表格:表格基本标签有:table标签(表格)、tr标签(行)、td标签(单元格)。tr标签和td标签都要在表格的开始标签table和结束标签table之间才有效。语法1、表格最基本标签:table、tr、td。2、默认情况下,表格是没有边框的。要在table标签里面加

2020-12-13 17:31:19 110 1

原创 零基础小白三天学会基础HTML---day2

图像标签img任何一张网页都少不了图片,一个有图文的网页,会使得用户体验性更好。那么下面就来学习一下图片的用法。一、img标签简介在HTML中,图像使用img标签。对于“图像标签”,我们先掌握一个img标签和它的3个属性src、alt和title就行属性src–图像的文件地址属性alt–图片显示不出来时的提示文字属性title–鼠标移到图片上的提示文字1.img标签src属性src,即“source(源文件)”。img标签的src属性用于指定图像源文件所在的路径,它是图像必不可少的属性。语

2020-12-13 15:49:30 170

原创 零基础小白三天学会基础HTML---day1

1.HTML是什么?HTML是什么?HTML,全称“Hyper Text Markup Language(超文本标记语言)”,它是制作万维网页面的标准语言。HTML不是一门编程语言,而是一门描述性的标记语言。HTML最基本的语法如下:<标签>内容</标签>HTML的结构下面来介绍HTML的结构:一个HTML文档由4个基本部分组成:① 一个文档声明:声明这是一个HTML文档。② 一个html标签对:标签的作用相当于设计者在告诉浏览器,整个网页是从这里开始的,然后到

2020-12-07 23:44:34 106

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除