欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

jquery跳转页面方法(jquery跳转页面修改数据)

程序员文章站 2023-12-04 19:54:22
前端框架不会前端开发的后端不是一个好的后端开发,平时写点小项目可以用得上,先简单了解一下前端这个概念。前端: html(超文本标记语言),css(层叠样式表)和javascript(脚本语言)。htm...

前端框架

不会前端开发的后端不是一个好的后端开发,平时写点小项目可以用得上,先简单了解一下前端这个概念。

前端: html(超文本标记语言),css(层叠样式表)和javascript(脚本语言)。

html,通常说的h5,其实按标准来说,html4的后续版本不带编号了,并保证向前的兼容性。

css的版本3,增加了translate(),能完成以前一定需要js才能做到的动画,同时增加了flex弹性盒子(响应式设计,提供一种更加有效的方式来对一个容器中的子元素进行排列、对齐和分配空白空间,以往使用float)。

jquery跳转页面方法(jquery跳转页面修改数据)

jquery

jquery是一个快速、简洁的javascript框架,是继prototype之后又一个优秀的javascript代码库(或javascript框架)。

jquery设计的宗旨是“write less,do more”,即倡导写更少的代码,做更多的事情。

敲黑板简单来说就是封装了一部分的函数,简化了原生js的写法,在实际使用时,jquery对dom树进行操控,即:首先有一个写好的html页面,再对其修改操作,如写按钮事件函数,点击隐藏,切换,页面跳转等。

jquery库包含以下功能:

  • html元素选取
  • html元素操作
  • css操作
  • html事件函数
  • javascript特效和动画
  • html dom遍历和修改
  • ajax
  • utilities

除此之外,jquery还提供了大量的插件。它兼容各种主流浏览器,如ie 6.0+、ff 1.5+、safari 2.0+、opera 9.0+等。

这个曾经也是现在依然最流行的web前端js库,可是现在无论是国内还是国外他的使用率正在渐渐被其他的js库所代替,随着浏览器厂商对html5规范统一遵循以及ecma6在浏览器端的实现,jquery的使用率将会越来越低。

敲黑板(思考)为什么说jquery的使用率越来越低?

vue

vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。

与其它大型框架不同的是,vue 被设计为可以自底向上逐层应用,通过尽可能简单的 api 实现响应的数据绑定和组合的视图组件。

vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。

vue是一个兴起的前端js库,是一个精简的mvvm。从技术角度讲,vue.js 专注于 mvvm 模型的 viewmodel 层。

jquery跳转页面方法(jquery跳转页面修改数据)

它通过双向数据绑定把 view 层和 model 层连接了起来,通过对数据的操作就可以完成对页面视图的渲染。

当然还有很多其他的mvvm框架如angular,react都是大同小异,本质上都是基于mvvm的理念。然而vue以他独特的优势简单,快速,组合,紧凑,强大而迅速崛起。

敲黑板为什么说“通过对数据的操作就可以完成对页面视图的渲染”?

vue.js是一种基于mvvm方式的框架,专注于mvvm模型的viewmodel层,通过双向数据绑定的方式将model层和view层连接起来。

而在vue中实现双向数据绑定的原理是:采用数据劫持结合发布者-订阅者的方式,通过object.defineproperty()来劫持各个属性的setter,getter,在数据变动时,发布消息给订阅者,触发相应的监听回调。

通俗的讲,就是利用observe监听model层的数据变化;利用compile来编译解析模板指令,最终利用watcher搭起observer和compile之间的通信桥梁,达到数据变化 (model)-》视图更新(view);视图变化(view)-》数据(model)变更的双向绑定效果。

敲黑板:可以说操作dom的事儿,就留给框架去做了。这比传统jquery开发效率高,代码可维护性高,可扩展性强、性能好。

jquery操作思想

jquery是使用选择器($)选取dom对象,对其进行赋值、取值、事件绑定等操作,其实和原生的html的区别只在于可以更方便的选取和操作dom对象,而数据和界面是在一起的。比如需要获取label标签的内容:$(“lable”).val();,它还是依赖dom元素的值。

vue操作思想

vue基于一种mvvm模式,使用数据驱动的方式,通过vue对象将数据和view完全分离开来了。对数据进行操作不再需要引用相应的dom对象,可以说数据和view是分离的,他们通过vue对象这个vm实现相互的绑定。

jquery应用场景

jquery侧重样式操作,比如一些h5的动画页面;需要js来操作页面样式的页面。

敲黑板jquery的编程思想是首先编写html和css的页面展示再操作dom树,而框架是首先考虑页面的功能,再进行前端的展示,编程思想正好相反。

vue应用场景

vue侧重数据绑定,比如复杂数据操作的后台页面;表单填写页面。

敲黑板二者也是可以结合起来一起使用的,vue侧重数据绑定,jquery侧重样式操作,动画效果等,则会更加高效率的完成业务需求。

vue带来了哪些改变?

我是一名后端开发,刚开始入门时接触js然后jquery,感觉它更像是一把剪刀,简单而犀利,通常是配合一些框架来完成一些静态页面开发的工作。

因为jquery的诸多局限性导致前端工程师的发展受到了很多的限制,只能做一些表面性的工作,并不能实现前后端分离开发。

而近期出现的vue,它给前端带来了无限的可能和改变。

改变一:真正意义上的前端工程师

之前开发都是前端做静态页面,把页面给到后台程序员改成jsp、php、asp等等…一顿乱改,一顿塞变量,做完以后页面样式乱七八糟,最后你再调整css。说白了你会html,css就行了,基本没什么门槛,可以这么说。

有了vue和node的前端工程化以后,前端工程师能做的事情越来越多,后台人员只需要抛过来一个api,剩下的就可以都交给前端了。

改变二:服务端渲染vs客户端渲染

传统的jsp、php或是模板渲染也好,都是服务端渲染,就是客户端一个请求,服务器直接把整个页面返回给你,简单粗暴。(spring boot是通过模板引擎,由服务端完成的渲染工作)

但是vue开发是前后端分离开发,通过api进行交互,客户端请求服务器返回json数据,由客户端进行渲染。

不仅减轻了服务器的压力速度更快而且渲染更加优雅,代码更容易维护。

改变三:渲染优雅,代码易维护

jquery是通过dom来控制数据,不仅笨重而且渲染数据特别麻烦,而 vue是通过数据来控制状态,通过控制数据来控制渲染,变量可以直接写在标签中,渲染更加优雅。

因为前端代码和后台代码都是分开的,所以项目更容易维护,开发效率更高。

改变四:项目工程化,结合npm直接安装第三方库

vue让前端项目更加工程化,同时也规范了前端工程师的代码,而node和npm的加入才是vue能蓬勃发展的重要原因。

node为vue提供了本地server和模块化开发的思路,npm更能安装vue项目需要的模块,配合vue使用,比如moment.js element ui vuex等等,这些第三方库让vue有了无限的可能。

敲黑板(补充下)传统开发jquery是命令式编程,现代框架开发是函数式编程。现代框架开发,可以使用webpack(当然使用jquery也可以使用webpack),可以使用人家提供的现成的脚手架,比方说create-react-app,vue-cli。极大提高了开发的效率,并且可以使用最新的es6、es7语法进行开发,在编码体验上,就提高了一个档次。

总结

知其然,知其所以然,没有最好的框架,只有最合适的框架!