基于jQuery框架的Web前端开发设计方法研究

基于jQuery框架的Web前端开发设计方法研究内容摘要 现如今前端开发已经成为全球互联网产业中需求量极大的一部分服务内容，世界各地的用户都需要更加强大更多功能化的前端系统。因此探究前端开发设计的方案就显得尤为重要。目前jQuery框架是世界上应用较为广泛的一种前端开发结构，软件工程师应当对其特征以及使用方法作出充分的了解，在此基础上尽可能地按照客户需求来实行后续开发方案，以满足各种客户对前端功能的多样化要求。本文对相关方法提出了简要的剖析，给出了具有一定建设性的意见。关键词：Web前端;Web开发;jQuery框架文/李金铃因此人们对于网络软件产品的需求也在逐渐增长，各种各样的现如今网络正在全世界各地以前所未有的速度飞速普及，Web前端页面正在成为互联网产品服务增长过程中的刚性需求。互联网是我国当今经济发展的重要新增长点，是经济转型期强大的引擎和动力。为了争取更多的用户来体验互联网产品，并获得更好的互联网产品使用感受，互联网开发者普遍更加重视Web实践中不断成熟。本文介绍的前端的设计，因此众多成熟的方式。jQueryWeb框架就是其中重要的一种前端开发设计方法在1 Web得用户进行操作过程中，可以通过浏览器软件来完成对端的访问。虽然这种结构的应用非常广泛，但是也不可避免地现如今B/S前端开发研究实现的关键性技术结构是Web前端的主流设计方案。B/SWeb结构使前有一定的不足之处。这种结构中的面，因此对于使用进行个性化处理与修改，因此上网的体验相对比较单调。这其Web前端产品的客户而言，他们很难对网页HTML主要生成于服务器方中的技术难题基本体现在两个层面。首先是系统兼容性不足。在因此会导致两者标准存在差异。WebB/S结构下，Web前端技术平台完全依靠浏览器软件来工作，写与浏览器软件内部结构的兼容性难以完美协调。其次是更普前端技术平台的设计和编遍的代码缺陷问题。许多代码存在冗余混乱的情况，标签中的杂乱内容非常之多，在Web前端技术平台的编写和搭建过程中，许多编写前端代码的程序员都存在这样的不良工作习惯。但这种工作习惯实际上往往是不得已而为之，由于诸多互联网工程项目的运行时间都比较紧迫，以混合标签为主的代码编写方式非常常见。这使得代码编写过程可以调用许多现成的段落，利于项目的迅速完成，但是对后续维护而言是不利的。因此在现今的生产实践环节，就应当努力寻找新的技术来克服这一缺陷。关键环节。首先是对前端系统进行全面而有效的建设。这部分建设工作可以被划分成三个模块，分别为视觉效果，用户交互在jQuery框架的基础上，Web前端结构技术主要有两个效果，以及前端代码编写，这三个模块基本囊括了程的大部分工作安排。其次是加入所依据的高级语言基础是jQuery框架。jQueryWeb前端工多，几乎保留了所有些独特的长处：首先是CSS和Javascript。jQueryHTML体系中的优点，同时还有一框架的好处非常框架佳，几乎能与所有浏览器适配。其次是jQuery框架，内容简洁，同时兼容性极层架构，行为层的代码编写与框架结构之间有着很好的独立性。jQuery框架整体实行分最后则是行，并在文档修改过程中进行编辑也很容易，设计出的成果往往具备简洁美观的优势。jQueryjQuery框架的可扩展性也十分出色，增加代码简单易识构成大致可见图框架所需要运用的开发技术知2 Web前端系统开发方法分析1。2.1 Web总是以用户作为绝对的核心，目的是要满足用户的全方位需求。Web前端的开发过程需要先明确开发的目的。一般的开发前端开发流程分析在确定用户需求之后，就可以对前端系统进行总体规划，对最图1 jQuery框架的开发技术知识结构终的设计效果给出有效的方案，最好能够在面上给出具体的设计模型。这是为了更好地向客户展示计划中的网络产品。良好的开发计划可以使得顾客对网络产品产生足JavaScript语言层够的好感，及早确定产品或服务的购买倾向，就可以对端的具体项目执行过程进行环节设计。整个流程环节的设计，Web前大致可以分成四个过程，依次是使用需求调研、初级设计、高保真设计以及正式代码的详细编写。在代码的编写过程中，负责用户交互界面用户视觉界面的设计师与软件工程师将参与到项目流程中，保证先前的原型设计能够被尽量准确的实现。2.2 需求分析阶段行细致的解剖。需求分析的流程主要指的是针对网络开发产品需求分析又可以细分成两个环节，分别是对流程和方法进的目标确定好用户人群。分析方法则以市场调研和数据分析为主，发放问卷是这一阶段常用的一种分析方案。不过由于网络产品可以通过问卷调查，访谈调查等方式来完成前期的需求分析。具备显著的用户导向性，因此有时也可以邀请用户前来进行单独测试，更精准地获得用户反馈，完成调研工作。2.3 原型设计两者在目的上基本是相同的，只是分阶段进行的两步不同操作。原型设计可以分类为初级设计、高保真设计这两个环节。初级设计主要满足对网络产品进行整体架构雏型的创设，而高保真设计则可以具体确定下各种网络产品开发设计的细节。前调研过程中获悉的用户需求，将其转化成可设计的界面模型。初级设计主要包括下列若干个环节：a.分析交互。汇总先b.罗列。详细安排可视化界面上的各种元素，例如文本框、按钮、界面选择。为网页产品选择恰当的可视化界面方案。c.元素图形。d.确定工作时的先后顺序以及各个元素在界面上的空间位置。重要度排序。对各种元素的重要程度进行分类排序，型制作。按照先前给出的方案采取草图的形式将用户界面绘制e.原出来，得到一个基本能够展示设计方案与思想的模型。f.评估。针对当前公司或工作室的人力资源工作现状，对先前的方案可行性做出最终的确定和评价。可行性设计需要全面测试并实践正式开发时遇到的各种可能的困难，在初级设计顺利完成后，就可以进行高保真设计。高保真应用写，并且将用户界面的交互设计予以完成。jQuery框架来对脚本进行前期测试，将关键性代码完成编（下转第225页）

223

4.3 处理BIM教学软件的兼容问题受到国内建筑行业的发展影响，很多的企业都大力地应用BIM软件。但是在软件市场中，BIM软件的版本较多，学校在教学中，如果使用不同的版本，就会造成BIM教学出现一些软件的兼容问题，会影响到教学的效果。因而，政府部门要着力研究一套BIM软件的统一标准，在行业标准下，实现版本的统一。土建专业的学校应该相互协作，增强信息的沟通交流，实现资源共享，来提高BIM技术教学的科学性，以及实现BIM的信息的流动，来减少BIM版本不一致，而带来的更多教学困扰。4.4 在制图课程引入BIM技术BIM技术的应用可以帮助同学们在BIM软件上，构建三维立体图形，来加强同学们工程建筑图纸绘制时的空间思维的锻炼，而且能够让同学们对建筑空间有更深的认知，为其他课程的学习而奠定基础。教师在课堂上通过BIM软件，来绘制三维模型，保证同学们在软件想象出实体的建筑空间，而且能够在BIM软件清晰地表达出各图形之间的关系。通过大量的技术学习，让同学们可掌握更多BIM实操技能，同时，同学在学校期间，就了解BIM技术，可提高对该课程的学习热情。应用BIM技术，来设计三维立体模型，相比过去传统CAD学习，BIM软件可显著地提高建筑设计的质量水平。当同学们熟练地使用BIM软件操作，就能够为日后的工作而建立基础。结构识图是同学们学习的难点，同学们对图纸比较陌生，对图纸内部的各个钢筋的位置、长度理解不到位，应用平面时的方式来展示，让同学去更加清晰地了解到钢筋位置及钢筋的搭建关系，而且也使建筑结构更加清晰明了、直观形象。将建筑模型逐步实现可视化，而且让同学们可以深度理解平面法中各个标准的具体含义，结合设计图纸才能够将这些建筑部件以更清晰的方式来展现。5 结束语BIM技术作为当前建筑领域的最新技术，得到建筑企业的认可，BIM技术教学能够培养专业的人才队伍，但是在高校专业教学中，教师工作人员就应该根据实际的BIM技术教学课程，来加大对教学模式的研究。细致地给同学们讲解相关的技术知识，开设更多的编技术课程，并延长课程时间，加强对BIM技术教学的重视度，培养高端复合型的BIM技术人才。【参考文献】[1] 张倩倩.BIM技术在土建类专业识图教学中的应用研究[J].绿色环保建材,2020(02):219.[2] 郭一民.BIM技术在高校土建类专业教学中的应用研究[J].农家参谋,2017(12):280.[3] 何薏萍,涂婉玲,吴清华.BIM技术在高校土建类专业教学中的应用研究[J].现代物业(中旬刊),2019(04):265.[作者简介：周飞飞，杭州市萧山区第四中等职业学校。]2.4 正式代码的详细编写正式代码的编写主要包括下列若干个环节。1.代码工程分层。一般在编写代码之前可以将各种功能不同的代码按照表现、结构、行为这三个层级来进行分类。的结构层编写。在这一环节中需要保持恰到好处的HTML结构，不能太过简略，也不能过于繁琐。设计。这一环节的主要目的是将Web前端系统中的样式完成编写并且做好详细的注释。4.行为层设计。这一环节的工作需要运用JavaScript语言来进行，首先应当让编写出的系统能够和整体框架维持良好的兼容；同时在设计过程中还需要注意一个要点，也就是尽可能地保证Web前端产品运行中的行为可以相对独立地进行，避免脱离了脚本就无法完成核心工作的局面；在此基础上完成前端具体内容的编写和设计，并且对整个文档的规范性进行规定和描述，描述内容应该包括设计理念，产品功能，用户使用帮助索引以及API信息。3 jQuery框架在Web前端开发中的应用3.1 jQueryUI插件实现界面快速开发许多UI插件能够简洁有效的节省开发工程的工作量，避免反复重新编写一些成熟的代码，尽可能地减少工程的完成日期，让互联网企业可以将更多的精力用于产品本身的设计层面，继而使得用户的体验得到长远的提升。基于jQuery框架的UI插件数量和种类都非常之多，可以在官方网站或者其他各类开源代码网站上进行汇总并下载。得到的文件格式通常为js和css类型，把这些插件文件进行保存，然后适当的导入，即可实现直接引用插件功能的目的。详细的代码如下所示：//导入UI样式文件

href=”/”>//导入jquery文件

src=”>//导入jquery UI文件 3.2 Ajax技术实现异步数据交互在Web前端的工程执行过程中，Ajax异步交互是一项非常实用的技术。这项技术可以让网站在整体不进行刷新的情况下，只更新部分页面内容，避免了用户反复在访问过程中进行刷新或者跳转操作，节省了用户流量以及服务器响应时间，非常符合现今Web前端设计的核心理念。Ajax的本质是Javascript或XML的异步实现，可以有效的节省网络资源，缓解服务器在面对大量用户请求的过程中所遭受的压力。在jQuery框架下网页前端产品对服务器给出数据请求的原理，是在$.ajax()方法中封装$.get()、$post()方法，可以非常有效地提升用户在网络页面中进行操作的速率。目前成熟的该技术应用已经广泛出现在各类Web前端产品设计中，诸如用户对账户进行登录，对账户信息进行数据库查询，对网站所给出的综合信息建立下拉表单等等，都可以用Ajax技术来进行完成，这使得用户体验获得了极大提升，访问过程中整个网页可以保持稳定，只需要部分页面进行更新即可。4 结语在计算机网络工程运用中，Web前端设计是与用户最贴近，最密切相关的一块内容，因此这方面的用户要求往往也普遍比较高。jQuery框架在现如今的Web前端设计中具备强大的功能，拥有广泛地运用空间，在界面的快速开发以及界面的异步交互，这两大功能领域都有着很好的效果。网络工程师应当对这一框架进行充分的掌握，并且在生产实践中活用其优越的特色功能。【参考文献】[1] 王初阳.基于用户体验的手机软件交互设计研究[D].云南大学,2019[2] 刘国明.基于 jQuery 的 Web 前端组件的应用研究[J].无线互联科技,2019(21):106-107.[作者简介：李金铃（1993年），女，汉族，福建寿宁，本科，教师/助教，四川托普信息技术职业学院，研究方向：计算机软件技术web前端方向。]

225