前端开发
暗夜之洲
大家互相学习,公共进步~
展开
-
插入DOM元素
插入DOM元素插入Dom元素两种情况:1.要插入的元素是从页面中获取的dom结构 ,例如:$(".item")2.要插入的元素是通过变量存储的dom结构,例如:var html = "<div class="item"></div>"基于上,分为右边可以是变量:append(后内)prepend(前内)after(后外)before(前外...转载 2020-04-27 11:50:56 · 585 阅读 · 0 评论 -
JS中Math函数的常用方法
Math是数学函数,但又属于对象数据类型typeof Math=> ‘object’console.dir(Math)查看Math的所有函数方法。1,Math.abs()获取绝对值Math.abs(-12) = 122,Math.ceil() and Math.floor()向上取整和向下取整 console.log(Math.ceil(12.03));//...转载 2020-04-23 16:22:18 · 198 阅读 · 0 评论 -
css中的四种定位以及top和margin-top的区别
css中一共有四种定位分别是默认,相对,绝对,固定position:static,这种定位是默认的,一般没什么实际的作用。position:relative,相对定位 ,不会脱离文档流,类似于static,按顺序排列,一般设置也不会有什么变化,可以通过margin-top/right/bottom/left来改变框的位置position:absolute,绝对定位,这种定位脱离文档流,可以...转载 2019-08-22 19:33:50 · 387 阅读 · 0 评论 -
Vue学习笔记之二 :加载原理
在初始化的Vue项目中,我们最先接触到的就是main.js,App.vue,index.html这三个文件,我们从培训视频或者官方文档上可以了解到:index.html---主页,项目入口App.vue---根组件main.js---入口文件这三个文件在项目构建的时候自动生成的index.html里面有个id="app",是App.vue里new Vue()实例的挂载点。而这个...原创 2019-08-23 15:25:38 · 510 阅读 · 0 评论 -
javascript数据类型的判断
一、javascript的数据类型js数据分为两种类型:原始数据类型和引用数据类型。原始数据类型有:string、number、boolean、undefined和null引用数据类型有:Function、Object、Date、RegExp、Number、String、Boolean和自定义类等其中原始数据类型也称基础数据类型,是不可拆分的数据类型,他存在于栈中;而引用数据类型也是通常意义...转载 2019-08-26 12:09:36 · 82 阅读 · 0 评论 -
js中哪些值在if判断是false
1:02:false3:null4:undefined5:''或者"" // 空字符串6:NaN以上几种值在做if判断时,返回的都是false。那么其他的值在做if判断时,返回的都是true。转载 2019-09-11 10:54:57 · 459 阅读 · 0 评论 -
隐藏和显示-元素是否占用位置
转载 2019-09-25 15:51:19 · 437 阅读 · 0 评论 -
常用dom操作
1.交换两个dom$(".msg-content").insertAfter($(".msg-bottom"));原创 2019-09-25 15:54:17 · 79 阅读 · 0 评论 -
H5聊天工具页面手机键盘显示消失问题优化
如图,H5做一个类似微信的聊天页面,如何经常发现键盘的弹出会遮挡页面,或者键盘消失,页面留下白块,我的解决思路如下:键盘弹出的时候,把内容显示部分的dom高度改小,键盘消失,内容部分dom恢复初始值。这么做主要考虑是iphone手机,键盘弹出,整个dom就会被挤到屏幕上方之外,所以你的欢迎语什么的都看不到了。1.全局变量保存高度var Height= document.body...原创 2019-09-26 19:00:35 · 879 阅读 · 0 评论 -
CSS 元素垂直居中的 6种方法
CSS 元素垂直居中的 6种方法利用CSS进行元素的水平居中,比较简单,行级元素设置其父元素的text-align center,块级元素设置其本身的left 和 right margins为auto即可。本文收集了六种利用css进行元素的垂直居中的方法,每一种适用于不同的情况,在实际的使用过程中选择某一种方法即可。Line-Height Method试用:单行文本垂直居中,demo...转载 2019-10-11 18:08:09 · 98 阅读 · 0 评论 -
js创建对象的多种方式及优缺点
在js中,如果你想输入一个的信息,例如姓名,性别,年龄等,如果你用值类型来存储的话,那么你就必须要声明很多个变量才行,变量声明的多了的话,就会造成变量污染。所以最好的方式就是存储到对象中。下面能我就给大家介绍几种创建对象的方式,并且给大家说一下他们的优缺点方式一:对象字面量var obj={ name:"赵云", type:...转载 2019-08-19 15:11:27 · 163 阅读 · 0 评论 -
js 中new 和Object.creat()的区别
1. new//定义classvar Person = function (firstName) { this.firstName = firstName;};//定义methodPerson.prototype.sayHello = function() { console.log("Hello, I'm " + this.firstName);};//实例对象var...转载 2019-08-19 14:56:48 · 159 阅读 · 0 评论 -
JavaScript 的继承与多态
es6之前,javascript本质上不能算是一门面向对象的编程语言,因为它对于封装、继承、多态这些面向对象语言的特点并没有在语言层面上提供原生的支持。但是,它引入了原型(prototype)的概念,可以让我们以另一种方式模仿类,并通过原型链的方式实现了父类子类之间共享属性的继承以及身份确认机制。其实,面向对象的概念本质上来讲不是指某种语言特性,而是一种设计思想。如果你深谙面向对象的编程思想,即使...转载 2019-08-19 14:44:49 · 153 阅读 · 0 评论 -
JS中的call、apply、bind方法详解
JS中的call、apply、bind方法详解一.在JavaScript中,call和apply都是为了改变某个函数运行时上下文context而存在的,换句话说,就是为了改变函数体内部this的指向。JavaScript的一大特点是,函数存在“定义时上下文”和“运行时上下文”以及“上下文是可以”改变的这样的概念。function fruits() {} fruits.prototyp...转载 2019-07-25 21:17:49 · 317 阅读 · 0 评论 -
JavaScript的ajax请求
一.传统方法的缺点:传统的web交互是用户触发一个http请求服务器,然后fuwuq收到之后,再做出响应到用户,并且返回一个新的页面,每当服务器处理客户端提交的请求是,客户都只能空闲等待,并且哪怕只是很小的一次交互,只需从服务器端得到很简单的一个数据,都需要返回一个完整的HTML页面,而用户每次都要浪费时间和宽带去重新读取整个页面。这个做法浪费了许多宽带,由于每次应用的交互都需要向服务器...转载 2019-07-25 22:26:03 · 688 阅读 · 0 评论 -
HTML标签总结
一.定义:HTML标签是由一对尖括号包裹的单词构成的。标签不区分大小写,推荐使用小写。标签氛围两部分,起始标签<HTML>和结束标签</HTML>,两个标签之间的部分我们叫做标签体。也有一种自闭标签,例如:<br/><hr/><input/><img/>。标签可以嵌套,但是必须保证嵌套的正确性。二.盒子模型所有HT...转载 2019-07-27 14:54:29 · 189 阅读 · 0 评论 -
JavaScript获取dom的几种方式
DOM是一个属性结构,操作一个DOM节点,时间就是这几个操作:更新,删除,添加,遍历。在操作DOM之前,需要通过各种方式拿到DOM节点,常用方法有:一.通过元素类型的方法来操作document.getElementById();//id名,在实际开发中较少使用,选择器中多用class,id一般只用在顶级层存在,不能太过于依赖id document.getElementsByTagName...转载 2019-07-27 15:29:55 · 160 阅读 · 0 评论 -
JavaScript中数组常用方法总结
一.find与findIndexfind方法返回通过测试(函数内判断)的数组的第一个元素的值。find方法为数组中每个元素都调用一次函数执行:当数组中的元素在测试条件时返回true,find()返回符合条件的元素,之后的值不会再调用执行函数。 如果没有复合条件的元素返回值,返回undefined。 find()对于空数组,函数是不会执行的。 find()并没有改变数组的原始值。...原创 2019-07-28 17:47:26 · 172 阅读 · 0 评论 -
dom加载顺序
Dom文档的加载步骤:解析HTML结构 加载外部的脚本和样式文件 解析并执行脚本代码 执行$(function(){})内对应代码 加载图片等二进制资源 页面加载完毕,执行window.onload再说说$(function(){}),$(window).load(function (){})也是等待所有的内容都加载完之后执行。和window.onload区别:$(functi...原创 2019-08-09 10:10:00 · 422 阅读 · 0 评论 -
JavaScript立即执行函数
一.先说说JavaScript函数声明的几种方式1.函数声明使用function关键字,并指定函数名。function a() { console.info('a****')}2.函数表达式用function关键字声明函数,但是未指定函数名,其实就是一个匿名函数并把这个匿名函数赋予一个变量。var b = function () { console.info(...原创 2019-08-09 11:11:34 · 99 阅读 · 0 评论 -
JavaScript数据类型及深拷贝,浅拷贝原理
一.栈(stack)和堆(heap)stack为自动分配的内存空间,它由系统自动释放;而heap则是动态分配内存,大小,也不一定会自动释放。二.数据类型JavaScript分两种数据类型:基本数据类型:Number,String,Boolean,Null,Undefined,Symbol(ES6),这些类型可以直接操作保存变量中的实际值。引用数据类型:Object(JS中除了基...转载 2019-08-19 10:55:10 · 84 阅读 · 0 评论 -
JavaScript原型与原型链
一、概述在 JavaScript 中,是一种面向对象的程序设计语言,但是 JS 本身是没有 “类” 的概念,JS 是靠原型和原型链实现对象属性的继承。在理解原型前,需要先知道对象的构造函数是什么,构造函数都有什么特点?1. 构造函数// 构造函数 Person()function Person(name, gender) { this.name = name; ...转载 2019-08-19 11:40:02 · 85 阅读 · 0 评论 -
前台开发事件委托
一.概念1.事件:HTML DOM使javascript有能力对事件作出反应。比如点击事件,鼠标移入移除事件等。事件通常与函数配合使用,这样就可以通过法师的事件来驱动函数。2.DOM事件流:事件冒泡流和事件捕获流。参考:https://blog.csdn.net/qq_37413883/article/details/827724723.DOM事件模型:捕获,目标,冒泡。4.事件委...转载 2019-07-25 19:23:43 · 90 阅读 · 0 评论