Fe-interview: [html] 第359天 说下你对组件、模块、元素的理解，它们的区别在哪里？

Created on 8 Apr 2020  ·  4Comments  ·  Source: haizlin/fe-interview

第359天 说下你对组件、模块、元素的理解，它们的区别在哪里？

我也要出题

html
Source
picture haizhilin2013

Most helpful comment

组件

  • 一般为自定义的有比较高的复用性，比较广泛的通用性的一段代码或多段代码组成。例如： 表单组件 Table组件，轮播组件等，都是有比较高的复用和通用效果。

模块

  • 一般是为了更好的可维护，更清晰的结构，根据整体切分出的组成部分，同时也提高复用性，但一般模块的通用性不如组件。

  • 模块可以会包含一个或多个组件。

    元素

  • 元素一般是指向比较具体的某一项，比较简单的个体，例如一个HTML标签，一张图片，一个音视频文件。

picture mx623303468 on 9 Apr 2020
👍3

All 4 comments

元素：元素是网页的一部分，在 XML 和 HTML 中，一个元素可以包含一个数据详情或者是一块文本或者是一张照片，亦或是什么也不包含。 一个典型的元素包括一个具有属性的开始标签，中间的文本内容和一个结束标签。

模块：主要是导入导出 import和export
1.一个模块就是一个单例，或者说就是一个对象；
2.每一个模块内声明的变量都是局部变量， 不会污染全局作用域；
3.模块内部的变量或者函数可以通过export导出；
4.一个模块可以导入别的模块。

组件：组件可以扩展 HTML 元素，封装可重用的代码。在较高层面上，组件是自定义元素

fuduoluo picture fuduoluo on 9 Apr 2020

组件是一段小巧,独立,可复用的代码块,其具有较高的封装,可以重复使用,组件里面包含html+css+js

1164226245 picture 1164226245 on 9 Apr 2020

组件

  • 一般为自定义的有比较高的复用性，比较广泛的通用性的一段代码或多段代码组成。例如： 表单组件 Table组件，轮播组件等，都是有比较高的复用和通用效果。

模块

  • 一般是为了更好的可维护，更清晰的结构，根据整体切分出的组成部分，同时也提高复用性，但一般模块的通用性不如组件。

  • 模块可以会包含一个或多个组件。

    元素

  • 元素一般是指向比较具体的某一项，比较简单的个体，例如一个HTML标签，一张图片，一个音视频文件。

mx623303468 picture mx623303468 on 9 Apr 2020
👍3

:apple:组件

  • Custom elements（自定义元素）：一组JavaScript API，允许您定义custom elements及其行为，然后可以在您的用户界面中按照需要使用它们。

  • Shadow DOM（影子DOM）：一组JavaScript API，用于将封装的“影子”DOM树附加到元素（与主文档DOM分开呈现）并控制其关联的功能。通过这种方式，您可以保持元素的功能私有，这样它们就可以被脚本化和样式化，而不用担心与文档的其他部分发生冲突。

  • HTML templates（HTML模板）：