Web前端
关注
分享
扫一扫
文章平均质量分 81
ffeeng
Java程序猿，挨踢攻城狮
展开
-
Nodejs热部署
方式一、supervisorsudo npm install -g supervisor #安装supervisor app.js #启动方式二、hotnodesudo npm -g install hotcode #安装hotnode app.js #启动经过比较比较推荐第一个，因为它更快！...原创 2019-10-13 15:46:44 · 394 阅读 · 0 评论 -
前端基础：面试大纲，常见技术词汇，每一个术语都可以长篇大论
HTML&CSS：对Web标准的理解（结构、表现、行为）、浏览器内核、渲染原理、依赖管理、兼容性、CSS语法、层次关系，常用属性、布局、选择器、权重、盒模型、Hack、CSS预处理器、CSS3、Flexbox、CSS Modules、Document flow、BFC、HTML5（离线 & 存储、Histoy,多媒体、WebGLSVGCanvas）；Ja...原创 2019-06-16 19:51:03 · 352 阅读 · 0 评论 -
属性描述对象
概述JavaScript 提供了一个内部数据结构，用来描述对象的属性，控制它的行为，比如该属性是否可写、可遍历等等。这个内部数据结构称为“属性描述对象”（attributes object）。每个属性都有自己对应的属性描述对象，保存该属性的一些元信息。下面是属性描述对象的一个例子。{ value: 123, writable: false, enumerable: tru...转载 2019-06-11 14:38:54 · 533 阅读 · 0 评论 -
移动端调试环境搭建
一 、调试手机端chrome浏览器PC端chrome版本手机端chrome版本 ：Chrome (75.0.3770.67)1、用USB将PC与手机连接2、在手机的chrome浏览器中随便打开一个网页3、在PC的chrome浏览器中输入 chrome://inspect/#devices打开如图页面，可以看到手机打开的页面在这里出现点击inspect ，就出现...原创 2019-07-16 15:43:21 · 267 阅读 · 0 评论 -
处理端口占用问题
最近写项目，总是出现端口被占用的问题，原来傻傻的把电脑重启一下，终于有一天受不了了，想要想办法解决。刚开始从网上找了好多教程，发现不行。开始自己尝试，终于，成功的将占用端口的进程杀掉。在此记录下过程(以8080端口为例)：第一步，打开cmd命令窗口，输入命令，根据端口号查找对应的进程号netstat -ano | findstr 80 //列出进程极其占用的端口，且包含 801结果如下：...转载 2019-07-17 16:30:03 · 170 阅读 · 0 评论 -
大陆、港澳台身份证、护照、军官证的正则表达式
最近工作因为工作需要，有一个身份验证需要前端验证大陆、港澳台身份证、护照、军官证号码的合法性。初步整理了一下各个验证的正则表达式，如有错误请大家指出，谢谢！大陆身份证正则表达式：idCardValid(id) { // 1 "验证通过!", 0 //校验不通过 var format = /^(([1][1-5])|([2][1-3])|([3][1-7])...转载 2019-08-06 11:46:11 · 15280 阅读 · 1 评论 -
User-Agent分析及其价值简析
User-Agent，用户代理。用户在上网访问的时候会作为HTTP的包头的一部分向服务器发送，用于识别用户的当前环境，如浏览器及版本号、操作系统等信息。在Chrome中可以在访问网站的时候按下F12查看。User-Agent也是用户识别的重要部分，通过分析，能知道用户使用的是什么设备、什么浏览器、什么应用等，进而可以分析其购买力、属性、职业等。比如我在使用的Chrome的User-Agen...转载 2019-08-12 16:54:03 · 1316 阅读 · 0 评论 -
移动端常见的一些兼容性问题
随着手机的普及，移动端的开发也成了一个重要的方向，但由于设备的不统一会造成一些兼容性问题，1、安卓浏览器看背景图片，有些设备会模糊。用同等比例的图片在PC机上很清楚，但是手机上很模糊，原因是什么呢？经过研究，是devicePixelRatio作怪，因为手机分辨率太小，如果按照分辨率来显示网页，这样字会非常小，所以苹果当初就把iPhone 4的960640分辨率，在网页里只显示了480320，...转载 2019-09-18 16:35:19 · 574 阅读 · 0 评论 -
5种回到顶部的写法从实现到增强
前面的话 本文先详细介绍回到顶部的5种写法，然后对其实现功能增加，最后得到最终实现写法【1】锚点使用锚点链接是一种简单的返回顶部的功能实现。该实现主要在页面顶部放置一个指定名称的锚点链接，然后在页面下方放置一个返回到该锚点的链接，用户点击该链接即可返回到该锚点所在的顶部位置[注意]关于锚点的详细信息移步至此<body style="height:2000px;"> ...转载 2019-09-23 10:08:37 · 866 阅读 · 0 评论 -
Postman mockserver详细教程
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。 ...转载 2019-09-23 15:52:08 · 430 阅读 · 0 评论 -
flex布局兼容性写法
1.容器写法display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */ display: -moz-box; /* Firefox 17- */ display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */ di...转载 2019-09-29 16:30:41 · 899 阅读 · 0 评论 -
页面布局的方式有哪些？
方式：双飞翼、多栏、弹性、流式、瀑布流、响应式布局 （1）、双飞翼布局 经典三列布局，也叫做圣杯布局【Holy Grail of Layouts】是Kevin Cornell在2006年提出的一个布局模型概念，在国内最早是由淘宝UED的工程师传播开来，在中国也有叫法是双飞翼布局，它的布局要求有几点： a、三列布局，中间宽度自适应，两边定宽； b、中间栏要在浏览器中优先展示渲染； c、允许任意列...原创 2019-05-23 19:30:54 · 4376 阅读 · 0 评论 -
解释下浮动和它的工作原理？清除浮动的技巧？
浮动元素脱离文档流，不占据空间。浮动元素碰到包含它的边框或者浮动元素的边框停留。(1)、使用空标签清除浮动。这种方法是在所有浮动标签后面添加一个空标签定义css clear:both. 弊端就是增加了无意义标签。(2)、使用overflow。给包含浮动元素的父标签添加css属性 overflow:auto; zoom:1; zoom:1用于兼容IE6。(3)、使用after伪对象清除浮...原创 2019-05-23 19:22:04 · 1025 阅读 · 0 评论 -
link和@import的区别?
XML/HTML代码<link rel='stylesheet' rev='stylesheet' href='CSS文件' type='text/css' media='all' />XML/HTML代码<style type='text/css' media='screen'>@import url('CSS文件');</style&...原创 2019-05-20 14:12:51 · 124 阅读 · 0 评论 -
IE兼容性
浏览器内核：1.Trident内核：IE,MaxThon,TT,The World,360,搜狗浏览器等。[又称MSHTML]2.Gecko内核：Netscape6及以上版本，FF,MozillaSuite/SeaMonkey等3.Presto内核：Opera7及以上。 [Opera内核原为：Presto，现为：Blink;]4.Webkit内核...原创 2019-05-20 14:39:59 · 369 阅读 · 0 评论 -
HTML全局属性(global attribute)有哪些?
accesskey规定激活元素的快捷键；class规定元素的一个或多个类名（引用样式表中的类）；contenteditable规定元素内容是否可编辑；contextmenu规定元素的上下文菜单。上下文菜单在用户点击元素时显示。data-*用于存储页面或应用程序的私有定制数据。dir规定元素中内容的文本方向。draggable规定元素是否可拖动。dropzo...原创 2019-05-20 15:14:34 · 778 阅读 · 0 评论 -
如何实现浏览器内多个标签页之间的通信?
WebSocket、SharedWorker； 也可以调用localstorage、cookies等本地存储方式； localstorage另一个浏览上下文里被添加、修改或删除时，它都会触发一个事件， 我们通过监听事件，控制它的值来进行页面信息通信；注意quirks：Safari在无痕模式下设置localstorge值时会抛出QuotaExceededError的异常；...原创 2019-05-21 17:09:51 · 204 阅读 · 0 评论 -
WebSocket与消息推送？
B/S架构的系统多使用HTTP协议，HTTP协议的特点： 1 无状态协议 2 用于通过 Internet 发送请求消息和响应消息 3 使用端口接收和发送消息，默认为80端口 底层通信还是使用Socket完成。HTTP协议决定了服务器与客户端之间的连接方式，无法直接实现消息推送（F5已坏）,一些变相的解决办法：双向通信与消息推送轮询：客户端定时向服务器发送Ajax请求，服务器...原创 2019-05-21 17:40:11 · 180 阅读 · 0 评论 -
请你说说CSS有什么特殊性?（优先级、计算特殊值）
优先级(1)、同类型，同级别的样式后者先于前者(2))、ID > 类样式 > 标签 > *(3)、内联>ID选择器>伪类>属性选择器>类选择器>标签选择器>通用选择器(*)>继承的样式(4)、具体 > 泛化的，特殊性即css优先级(5)、近的 > 远的 (内嵌样式 > 内部样式表 > 外联样式表)...原创 2019-05-21 18:55:37 · 574 阅读 · 0 评论 -
HTML5语意元素
HTML5语义元素语义= 意义语义元素 = 有意义的元素什么是语义元素?一个语义元素能够清楚的描述其意义给浏览器和开发者。无语义元素实例: <div> 和 <span> - 无需考虑内容.语义元素实例: <form>, <table>, and <img> - 清楚的定义了它的内容.浏览器支持Int...原创 2019-05-23 16:41:15 · 185 阅读 · 0 评论 -
block，inline和inlinke-block细节对比？
• display:blocka、block元素会独占一行，多个block元素会各自新起一行。默认情况下，block元素宽度自动填满其父元素宽度。b、block元素可以设置width,height属性。块级元素即使设置了宽度,仍然是独占一行。c、block元素可以设置margin和padding属性。• display:inlinea、inline元素不会独占一行，多个相邻的行内元素会...原创 2019-05-23 19:08:45 · 184 阅读 · 0 评论 -
说说浮动元素会引起的问题和你的解决办法
问题：（1）父元素的高度无法被撑开，影响与父元素同级的元素（2）与浮动元素同级的非浮动元素会跟随其后（3）若非第一个元素浮动，则该元素之前的元素也需要浮动，否则会影响页面显示的结构解决方法：使用CSS中的clear:both;属性来清除元素的浮动可解决问题(2)、(3)，对于问题(1)，添加如下样式，给父元素添加clearfix样式：.clearfix:after{content: ...原创 2019-05-23 19:11:42 · 640 阅读 · 0 评论 -
你有哪些性能优化的方法？
网页内容： 1.减少http请求: http协议是无状态的应用层协议，意味着每次http请求都要建立通信链路、进行数据传输。 减少http的主要手段是合并css、合并javascript、合并图片。 2.减少DNS查询次数 3.避免页面跳转 4.使用浏览器缓存：缓存AJAX 5.延迟加载：LazyLoad Images。刚加载的时候减少http请...原创 2019-05-23 19:17:58 · 827 阅读 · 0 评论 -
浅谈session,cookie,sessionStorage,localStorage的区别及应用场景
浏览器的缓存机制提供了可以将用户数据存储在客户端上的方式，可以利用cookie,session等跟服务端进行数据交互。一、cookie和sessioncookie和session都是用来跟踪浏览器用户身份的会话方式。区别：1、保持状态：cookie保存在浏览器端，session保存在服务器端2、使用方式：（1）cookie机制：如果不在浏览器中设置过期时间，cooki...转载 2019-05-20 14:10:52 · 177 阅读 · 0 评论