![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
web前端
文章平均质量分 69
web页面开发学习
棉马咪
这个作者很懒,什么都没留下…
展开
-
Http和websocket(用Nodejs简单实现websocket通信)
关于http和websocket的简介原创 2022-07-20 23:57:03 · 747 阅读 · 0 评论 -
js数组和伪数组以及它们之间的转化
“真”数组:[1,2,3,4,5]伪数组:需要满足以下两个条件:具有n个序列具有length的属性{1:1, 2:2, 3:3, length: 3}"真"数组转为伪数组var arr = [1,2,3];var arr1 = {};[].push.apply(arr1, arr);console.log(arr1);伪数组转化为“真数组”//注意:这种方法在低版本的浏览器中没有作用,推荐使用下面的方法var arr = [];var arr1 = {0:1, 1:2, 2原创 2021-11-24 18:51:08 · 618 阅读 · 0 评论 -
箭头函数中的this指向问题
普通函数中的this, 谁调用就指向谁箭头函数中的this,是父级作用域的this,而不是调用者箭头函数中的this永远指向父级作用域的this,无法通过apply/call/bind来修改例子1:因为没有将箭头函数放置于一个新的函数中,所以箭头函数属于全局作用域只有定义一个新的函数,才会开启一个新的作用域let obj = { name: 'Mike', say: function(){ console.log(this); }, h1: ()=原创 2021-11-22 00:50:36 · 626 阅读 · 0 评论 -
CSS清除浮动的方式(解决高度塌陷问题)
背景:当元素设置为float时候,容易造成高度塌陷的问题。本文主要讲解几种常见的解决方式现象1:紫色部分嵌套在带有红色边框的div中。但是由于1,2,3设置了float属性,导致红色边框的div高度塌陷。紫色部分的起始位置:上下有两条边框,于是在中间部分开始虽然红色框没有高度,但是它有边框的高度,因此占有一部分空间。蓝色div因此只能在红色部分以下。<html ><head> <meta charset="utf-8"> <titl原创 2021-06-18 16:49:57 · 267 阅读 · 0 评论 -
CSS小盒子和大盒子中水平垂直居中的办法
方法一:padding通过设置大盒子的padding属性和box-sizing属性,将小盒子挤到居中的位置。<html ><head> <meta charset="utf-8"> <title></title> <style type="text/css"> *{margin: 0; padding: 0} .out{ height: 500px;原创 2021-06-17 14:56:01 · 722 阅读 · 0 评论 -
CSS序列选择器专题
first-child/last-child选中同级别中的第一个匹配元素。<!--h1,p,p,div这四个元素是同一级别的,这里的第一个元素是h1,与p不匹配,不添加CSS样式红框中的p,p这两个元素是同一级别的,这里的第一个元素是h1,与p匹配,添加CSS样式--><html ><head> <meta charset="utf-8"> <title></title> <style type原创 2021-06-14 23:07:43 · 417 阅读 · 0 评论 -
CSS样式基础知识
CSS内部选择器就是找了一个统一的位置,去存放样式。然后将改样式作为模板,运用于其他的类似的标签上,节省了代码量。需要存放在标签中,然后放入head标签中语法如下所示选择器类型标签选择器 head html div等类别选择器 class=“xxx” 可以选择多个ID选择器 只能选择一个通用选择器,指定全局性的规则(一般用于将全局的padding和margin置为0)其他(一些组合写法)head, hetml, div{} 可以一起写head .class 父子级关系一个小原创 2021-06-13 11:16:41 · 366 阅读 · 0 评论 -
JavaScript原型、原型链、继承
原型是一个对象,其他的对象可以通过原型(_proto_)实现属性继承__prototype__是函数的原型(这个是例外),但是函数也有__proto__这个属性js中,除了null以外,其余的对象都有原型。查看原型:var a = [1, 2, 3];console.dir(a);打开浏览器,按下F12,可以看到下图这里有一个结论:大多数情况下,__proto__可以理解为构造器constructor的原型。即__proto__ == constructor.prototype。也就是说_原创 2021-06-07 09:23:24 · 97 阅读 · 0 评论 -
JavaScript中this的用法
this的指向:在函数运行时,当前的运行环境属于谁,this就指向谁独立使用在命名完一个函数后直接使用。其实是省略了window。console.log(this == window) //true function test(){ console.log(this == window)//函数中指向window }test() // truewindow.test() // true函数在命名完成后直接使用,也是独立使用。(function(){ console.log(this原创 2021-06-05 20:29:28 · 213 阅读 · 1 评论 -
前端优秀的文章的收集
getElementById和querySelector方法的区别原创 2021-05-16 00:44:31 · 107 阅读 · 0 评论 -
JavaScript事件(Event)
阻止冒泡<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title></head><style> #outer{ position: absolute; width: 400px; height: 400px; top:0;原创 2021-05-14 10:33:04 · 147 阅读 · 0 评论 -
JavaScript语法学习(一文带你学会JavaScript)
概述所有的代码必须写在<script type=“text/javascript”> 当中。如果需要引用外部的js文件,格式为 <script type=“text/javascript” src=“XXXXX”></script> src为链接的外部地址 而此时所有的代码必须为外部文件,写在其中的代码无效。每一句js语句后面都要跟上分号为了语法规范,script标签应该写在head标签当中,且可以引入多个script标签表示不同功能块<可以表示原创 2021-05-05 09:59:01 · 318 阅读 · 1 评论 -
html锚点链接小案例
案例1:回到首页<html > <head> <meta charset="utf-8"> <title></title> <style type="text/css"> *{border: 0;margin: 0; padding: 0;} .box1, .box2{ height: 3000px; width: 200px; background-color: green; }原创 2021-04-23 16:32:19 · 1113 阅读 · 0 评论 -
html用ul li制作导航条
制作的导航条如图所示:当鼠标滑过每个导航的时候,背景会变换颜色。技术点:将超链接a标签,转换成block标签,从而设置鼠标滑过时的背景色。代码如下所示:<html > <head> <meta charset="utf-8"> <title></title> <style type="text/css"> *{border: 0;margin: 0; padding: 0;} ul li{list-s原创 2021-04-23 13:03:57 · 3702 阅读 · 0 评论 -
web入门-html基础语法知识
HTML常用标签标记标题<h1>…</h1>: 1级标题<h2>…</h2>: 2级标题<h6>…</h6>: 6级标题(一共只有6级标题)段落<p>…</p>: 段落标记,用来表示一个段落<hr/>: 空标记,用来做水平线<br> : 空标记,用来设置字体换行字体<i>…</i>: 斜体<b>…</b>: 加粗&l原创 2021-04-22 13:25:05 · 362 阅读 · 1 评论