一个html页面怎么调用多个ajax吗_前端页面如何构成与企业前端如何合理架构？...

前端页面构成：

结构(HTML)、样式(CSS)、逻辑(JavaScript)

HTML：实际上并不能完成静态页面的建设，原因是现代的网站，HTML和HTML标签样式是分离的。

CSS：CSS对HTML结构进行布局并对结构内部的元素进行样式化，这样就形成了用户可见的静态页面。

JavaScript：的工作分为三个部分：

1、对于JS来说，HTML是一个文档，JS的第一要务是操作文档，使用

户可以对页面进行操作，构建交互功能，比如选项卡或轮播图的切

换，页面某个元素的特效、弹窗提示等等。

2、向后端请求动态数据以及数据整理与存储。比如AJAX数据请求。

3、数据可视化，将后端请求会的数据与HTML模板结合，动态插入到

页面中。

总结： JavaScript要做的事情就是对动态数据的获取与管理，页面动

态交互与页面的动态渲染。

那么企业的前端页面架构又设计那些要点呢？

1、模块化

对于编程来说，最基本的要素是『顺序、判断与循环』，所有的程序都是由这三个要素构成，由于程序的复杂性和多样性，往往程序的结构会变得越来越复杂，这时候，模块化的概念就诞生了，模块化允许我们把一个复杂的程序，拆分成多个程序体，将复杂的程序拆分成简单的或体积小的分支程序，或者将多段代码完成一个功能的程序拆分成多个小功能的程序，那么这些分支程序或小功能程序就是一个一个的模块，他们可以被任意组合和复用。这样既能解决程序间的耦合问题，也能让模块的功能得到极大的发挥，当然也能让程序更易维护、更新与版本迭代。

2、插件化

这个比较好理解，插件的目的就是将一个功能封装起来，用的时候直接调用就能实现功能，无需再次编写业务逻辑，比如轮播图插件，引用插件后，进行调用则可实现轮播功能。当然这个过程也不是那么简单，由于插件必须要具备复用性，所以必须使用面向对象的写法，那么要用插件就需要实例化插件进行配置和调用。

3、组件化

组件化，比模块化的概念更加宏观，模块化是拆分一个程序成多个程序，而组件化是把一个项目横向切成多个HTML/CSS/JS的组合，一个组合就是一个组件，在原本的结构、样式、逻辑分离的基础上，横向的又切了一刀，让多个结构、样式、逻辑块组合成一个完整的项目，这就是通俗的组件化设计。

当下企业的前端架构，必须以模块化为基础，进行组件化开发，多个开发者开发同一个项目，以组件为划分完成组件的结构样式与逻辑，逻辑内的程序拆分成多个模块，为组件逻辑层所用。当然要完成这样的架构必须依赖强大的前端工程化工具，比如webpack、gulp、grunt等等，依赖这些工程化工具可以完成打包工作，打包的过程就是组件与模块组合的过程。开发者不必关注打包后的项目，而仅仅维护与更新打包前的项目就可以了