深入前端
关注
分享
扫一扫
文章平均质量分 72
前端知识点
子月吾生
one day by one day
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
prettier安装和配置
prettier安装和配置1、prettier安装（1）命令安装（2）插件安装2、prettier配置 1、prettier安装 （1）命令安装 （2）插件安装 2、prettier配置 module.exports = { "printWidth": 100, // 超过最大值换行 "overrides": [ { "files": ".prettierrc", "options": { "parser": "json" }原创 2021-03-20 16:07:31 · 6284 阅读 · 0 评论 -
html5标签变化知识点汇总
HTML5在移动互联网中的优势之一： 它是唯一一个通吃Mac、PC、iPhone、Android等主流平台的跨平台语言。所以只要开发一遍，就可以在各个平台使用。 Web改变趋势：Native APP ——>Web APP ——> Hybrid APP 一、HTML5标签变化 1、DOCTYPE声明 （1）DOCTYPE声明必须是HTML文档的第一行，位于html标签之前，它不是HT...原创 2019-07-29 15:36:06 · 498 阅读 · 0 评论 -
background-positoin详解
如何使用背景图片位置 .block { margin: 0 auto; border: 5px solid yellow; width: 600px; height: 600px; background:no-repeat url(./img/demo1.jpg); ...原创 2018-09-27 12:45:56 · 364 阅读 · 0 评论 -
Canvas绘图
Canvas绘图 ——基本用法： 要在这块画布（canvas）上绘图，需要取得绘图上下文， 此时就要调用getContext()方法并传入上下文的名字。传入2d就可取得2d上下文对象。 同时在使用canvas元素之前首先要检测getContext()方法是否存在，虽然浏览器会为该标签创建一个DOM对象，而且可以应用它但它可能并没有getContext()方法。 如下： <can...原创 2018-09-14 10:11:59 · 284 阅读 · 0 评论 -
瞄点到某个具体位置的实现方式
1、给要瞄点文本添加id属性（id属性针对任何标签都生效）,通过a标签href属性的hash值进行跳转 <body> <div id="go-here">待瞄点文本</div> <div> <span><a href="#go-here"></a><\span> </div> </body> 2、给要瞄点文本添加name属性（name属性针对a标签生效）,通过a标签h原创 2020-08-14 17:51:28 · 372 阅读 · 0 评论 -
离线存储
Web存储机制 Web Stroage的两个主要目标： 提供一种在cookies之外存储会话数据的途径 提供一种存储大量可以跨会话存在的数据的机制 —— storage类型： 提供最大的存储空间来存储名值对儿。有如下方法： clear()： 删除所有值。firefox中没有实现。 getItem(name)： 根据指定的属性名字获取对应的值。 key(index)： 获得in...原创 2018-09-13 12:32:19 · 738 阅读 · 0 评论 -
canvas应用
&lt;head lang="en"&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;&lt;/title&gt; &lt;style&gt; .btn{ positio原创 2019-03-10 09:43:50 · 399 阅读 · 0 评论 -
HTML5属性变化汇总
一、input新增type类型 新增了：email、url、tel、number（主要针对移动端） <input type="email" name="email"> <input type="url" name="url"> <input type="tel" name="tel"> <input type="num...原创 2019-08-02 15:13:25 · 409 阅读 · 0 评论 -
限制input输入长度与内容
如果输入的是数字，通过监听input事件再通过slice进行截取限制长度 <input type="number" oninput="f(value.length>6)value=value.slice(0,4)"> 如果输入的是文字或者字符，就会有一个maxlength属性进行限制长度 <input type="text" placeholder="只能输入六个字符" maxlength="6"> ...原创 2020-09-07 20:02:48 · 14037 阅读 · 0 评论 -
HTML: 前端页面结构和加载过程
前端页面结构和加载过程页面结构举例说明：HTML 与 DOM 有什么不同操作 DOM虚拟 DOM 页面结构 最基本的页面结构： <html> <head></head> <body></body> </html> < html>元素是页面的根元素，它描述完整的网页； < head>元素包含了我们想包含在 HTML 页面中，但不希望显示在网页里的内容； < body>元素包含了我们访原创 2021-06-08 16:17:57 · 1081 阅读 · 2 评论 -
代码构建与webpack知识点
代码构建与webpack知识点1、Webpack 工具都做了些什么2、常见的前端构建工具3、了解Webpack（1）入口（entry）（2）输出（output）（3）Loader（4）插件（plugins）总结Webpack 到底对项目代码做了什么？ 1、Webpack 工具都做了些什么 如今前端项目大多数都使用了模块化，而如果想要将多个文件的代码打包成最终可按照预期运行的代码，则需要使用到代码构建工具。 不管项目代码是如何进行组织的，项目中又有多少个文件，最终浏览器依然会从 HTML 内容进行解析和加载原创 2021-05-27 18:04:44 · 811 阅读 · 4 评论 -
前端进阶者面试重点汇总
前端进阶者面试重点汇总一、前端三件套 HTML/CSS/JavaScript二、与 JavaScript 运行环境相关的浏览器和 Node.js：三、前端开发通用领域、网络、安全、算法和计算机通用知识。1、浏览器相关2、Node.js 相关3、网络相关4、安全相关5、算法与数据结构6、计算机通用知识四、知识汇总 一、前端三件套 HTML/CSS/JavaScript 面试官在面试 1~3 年经验的前端岗位候选人时会更多倾向于考察对页面布局原理的掌握，包括盒子模型、文档流、浮动布局等，以及常见页面布局的技巧原创 2021-05-26 11:37:20 · 675 阅读 · 2 评论 -
JavaScript中常说的四种模块规范
JavaScript中常说的模块规范CommonJS 规范AMD 规范UMD 规范ES6 模块 规范 CommonJS 规范 CommonJS 规范定义了模块应该怎样进行编写，从而各个模块系统之间可以进行相互操作。 var beta = require('beta'); function verb { return beta.verb(); } module.exports = { verb: verb }; CommonJS 有以下特点： 一个文件就是一个模块； 使用requir原创 2021-05-27 18:07:28 · 717 阅读 · 1 评论 -
前端环境搭建
前端环境搭建一、node.js安装1、windows安装node.js2、Mac上安装node.js先安装nvm 一、node.js安装 1、windows安装node.js （1） 百度搜索node.js进入node.js官网进行下载安装,一步步的点击next就可以安装完成。 （2）测试是否按照完成：在键盘按下【win+R】键，输入cmd，然后回车，打开cmd窗口 （3）在cmd窗口输入以下命令，如果显示版本号则表示按照成功。 node -v npm -v 注释：Node.js中自带npm，安装Nod原创 2020-07-23 18:20:12 · 2582 阅读 · 2 评论 -
详解深拷贝和浅拷贝以及如何深拷贝
深拷贝和浅拷贝一、如何区分深拷贝和浅拷贝二、举例加深理解深拷贝和浅拷贝三、图文理解四、哪些方法是浅拷贝，如何进行深拷贝 一、如何区分深拷贝和浅拷贝 内在的区别：浅拷贝就是简单的把指向别人的值的一个指针给复制过来，深拷贝就是实实在在的把别人的值给复制过来。 直接显示出来的区别：浅拷贝就是双方不是独立的，还会互相影响；深拷贝是不会影响到彼此，是独立的个体。 深拷贝与浅拷贝的存在主要还是受拷贝的数据类型所影响的。当拷贝的是js基本数据类型时，都会是深拷贝；如果拷贝的是js引用数据类型时，简单的赋值过来的时候就原创 2020-09-10 10:50:17 · 4529 阅读 · 0 评论 -
理解js栈内存和堆内存
内存分配与垃圾回收： 在编译阶段，除了声明变量和函数，查找环境中的标识符这两项工作之外，还会进行内存分配。不同类型的数据会分配到不同的内存空间 一般来说栈内存线性有序存储，容量小，系统分配效率高。而堆内存首先要在堆内存新分配存储区域，之后又要把指针存储到栈内存中，效率相对就要低一些了。 垃圾回收方面，栈内存变量基本上用完就回收了，而推内存中的变量因为存在很多不确定的引用，只有当所有调用的变量全部销毁之后才能回收。 栈内存：引擎执行代码时工作的内存空间，除了引擎，也用来保存基本值和引用类型值的地址。 堆原创 2020-09-09 11:46:24 · 556 阅读 · 0 评论 -
理解W3C是干什么的
W3C是指万维网联盟（word wide web consortium）;它是一个会员组织，其工作是对web进行标准化；W3C创建并维护WWW标准 W3C标准不是某一个标准，而是一系列标准的集合。网页主要由三部分组成：结构 （Structure）、表现（Presentation）和行为（Behavior）。对应的标准也分三方面：结构化标准语言主要包括 XHTML和XML；表现标准语言主要包括CS...原创 2019-06-02 16:17:17 · 2866 阅读 · 3 评论 -
解决前端跨域的方法有哪些
1、首先一个域名的组成： 当协议、子域名、主域名、端口号中任意一个不相同时，都算作不同域 JavaScript出于安全方面的考虑，不允许跨域调用其它页面的对象。跨域就可以理解为因为JavaScript同源策略的限制，a.com下的js无法操作b.com或者c.a.com域名下的对象。 2、处理跨域的方法： 1)处理方法一——在后台进行处理：通过在同域名下web服务器创建一个代理 例如某个前端页面...原创 2019-06-14 19:32:03 · 684 阅读 · 0 评论 -
前端开发中的几大布局的详细总结
一，静态布局（Static Layout） 在屏幕宽高有调整时，使用横向和竖向的滚动条来查阅被遮掩部分； 意思就是不管浏览器尺寸具体是多少，网页布局就按照当时写代码的布局来布置 二，弹性布局（Elastc Layout） 是CSS3引入的布局方式，其中flex-flow是flex-direction和flex-wrap属性的简写方式，语法如下： flex-flow:< flex-direct...原创 2018-11-28 19:50:30 · 3289 阅读 · 0 评论