首页
学习
活动
专区
工具
TVP
发布

重构进阶前端开发入门 (一) DOM 操作

这样切图、使用 HTML + CSS 编写网页的工作过程,我们一般称之为网页重构,关于网页重构和前端开发是否应该分离也一直存在争议。...但就日常工作的情况来看,二者还是很难彻底分开的,前端开发写脚本时必定需要网页重构的基础(比如动画控制、3D变换等),网页重构时也需要提前考虑前端脚本可控制标签的埋点,尽量避免后期再对页面结构和样式调整改动...那么,新同学们掌握网页重构后,又该开始哪些知识的学习?以便向前端开发进阶,拓展自己的技能树、全面发展呢? 个人认为主要需要学习的都是各类 JS 知识点。...DOM 操作 1. 什么是 DOM 做前端开发,每天都在和 DOM 打着交道,那么 DOM 到底是什么呢?...其它方式需要自己注意浏览器兼容性问题,以及区分单个 DOMDOM 数组返回值的情况。

72730

重构学习-重构原则

什么是重构: 视上下文重构有两个不同的定义,第一个定义是名词形式 对软件内部结构的一种调整,目的是在不改变软件可观察行为的前提下,提高其可理解性,降低其修改成本 重构的另一人用法是动词形式 使用一系列的重构手法...强调一下,重构不会改变软件的可观察行为,也就是说重构之后功能和原来一样。 为什么要重构重构改进软件设计,如果没有重构,程序的设计会逐渐腐败变质。...重构的原动力是:代码设计无法帮助我轻松的添加我所需要的功能,如果用某种设计方式,添加功能会简单的多,这种情况可以用 重构来弥补。重构是一个快速流畅的过程,一旦完成重构,新特性的添加会更快速,更流畅。...如果在修改bug和审查代码时发现不合理的地方也要进行重构,这样是为了更好的阅读和理解代码 何时不重构: 如果发现代码太混乱,重构它不如重写来的简单这种情况下建议重写,不用进行重构。...最后你没有时间进行重构表明你其实早就该进行重构重构与性能: 有时为了让代码更容易理解,会做出一些使程序运行变慢的修改,这是个重要的问题。

97050
您找到你想要的搜索结果了吗?
是的
没有找到

虚拟DOM与真实DOM

虚拟DOM(Virtual DOM)和真实DOM(Real DOM)是在Web开发中常用的两种概念。...虚拟DOM概念虚拟DOM是一个JavaScript对象的表示,它类似于真实DOM的轻量级副本。它以树形结构表示整个页面的DOM层次结构,包括元素、属性和文本内容等。...工作原理虚拟DOM的工作原理如下:初始渲染:首先,虚拟DOM会根据React组件的描述,创建一个表示整个组件结构的虚拟DOM树。...虚拟DOM比较:当组件的状态发生变化时,React会使用虚拟DOM比较算法,将当前的虚拟DOM树与先前的虚拟DOM树进行比较。...虚拟DOM与真实DOM的比较虚拟DOM和真实DOM有以下几个区别和比较:性能:虚拟DOM通过在内存中进行比较和更新,减少了对真实DOM的直接访问和操作,从而提高了性能和渲染效率。

82140

HTML DOM(一):认识DOM

什么是DOM?        通过 JavaScript,您可以重构整个HTML文档。您可以添加、移除、改变或重排页面上的项目。...这个入口,连同对HTML 元素进行添加、移动、改变或移除的方法和属性,都是通过文档对象模型来获得的(DOM)。在 1998 年,W3C 发布了第一级的 DOM 规范。...所有的浏览器都执行了这个标准,因此,DOM 的兼容性问题也几乎难觅踪影了。DOM 可被 JavaScript 用来读取、改变 HTML、XHTML 以及 XML 文档。...DOM 被分为不同的部分(核心、XML及HTML)和级别(DOM Level 1/2/3):        Core DOM                定义了一套标准的针对任何结构化文档的对象 ...       XML DOM                定义了一套标准的针对 XML 文档的对象         HTML DOM                定义了一套标准的针对 HTML

1.5K00

重构重构概要--六大重构模块

重构方法介绍: 重构改善既有代码的设计 一 重新组织函数 关于注释 :要尽可能少的使用注释 , 注释越多代码的可读性反而更差,注释可以使用函数名来代替 , 不要管函数名有多长, 即使函数名比函数中的代码还要长也不要紧...能更加明确的表明函数的意义,可以将这个算法替换; 二 在对象之间搬移特性 功能模块归属类:对象设计中, 将一个功能模块放在哪个类中,是最重要的任务之一,谁也不能一开始保证设计的是完全合适的,这就需要“对象之间搬移特性”这个重构方法...搬移函数和搬移字段:这两种重构方法都可以解决大多数的问题,如果两种方法同时使用,先搬移字段,在搬移函数。

63330

重构

个人觉得代码重构非常有必要,写程序不但要给机器运行,更让人看的明白。 写代码如写诗一样才行。(内容代码为主,建议实践一下比较好点) 实例 一个图书馆出租书的程序。...接着:直接看下面的代码重构呗 Book类: 将按照书的不同类型,按照不同价格统计的方法移动到Book类中,因为这个按理应该属于Book类中的。...第二次重构 经过第一次重构,还是没有实现需求修改增加多个分类的效果。那么接下来使用接口抽象来再次重构。...最后想说: 如果你发现自己需要为程序添加一个特性,而代码结构使你无法很方便地达成目的,那么就先重构那个程序,使特性的添加比较容易进行,然后再添加特性。...参考文章 【重构】作者: Martin Fowler

83110

DOM Core 与 HTML-DOM

1.DOM DOM(文档对象模型)是由W3C制定的一套访问和操作XML(eXtensible Markup Language)文档的标准,即API。...DOM与特定的平台、浏览器、语言无关,很多种语言都实现了DOM,比如因为JavaScript和PHP都实现了DOM,所以 JavaScript中有getElementsByTagName()方法,PHP...3.DOM Core和HTML-DOM 由于HTML与XML的相似性及差异,JavaScript不仅实现了标准的DOM方法和属性(即由W3C制定的),而且还实现了HTML特有的 DOM方法和属性,前者称为...DOM Core,并不专属于JavaScript,后者称为HTML-DOM。...不管是DOM Core还是HTML-DOM,我们在使用JavaScript的时候要注意浏览器之间的兼容性,因为不同的浏览器对这两类方法和属性的支持可能不一样。

1.8K10

重构

说到重构,我们再来了解一下定义:重构是一种对软件内部结构的改善,目的是在不改变软件的可见行为的情况下,利用设计思想、设计原则、设计模式编程规范等理论来优化代码。...重构目的:1.重构是时刻保证代码质量的一个极其有效的手段,防止代码腐化。当代码腐化到一定程度,量变引起质变,项目的维护成本已经高过重新开发一套新代码的成本。2.优秀的架构和代码是迭代出来的。...时机:持续的重构(做好重构计划,小步快跑,要保证代码仓库中的代码一直处于可运行、逻辑正确的状态.要做好与新功能,老代码的兼容工作。利用静态代码扫描,codeReview做好日常持续重构)。...重构手法总结为“十六字心法”,非常形象、贴切:旧的不变,新的创建。一步切换,旧的再见。...“旧的不变”是指先不动旧方法;“新的创建”是指创建一个跟原来方法功能相同的新方法,你可以通过先复制再重构的方式,来得到这个新方法,也就是整个系统的一个增量;“一步切换”是指,在充分测试之后,新的方法可以完全替代旧方法了

17530
领券