在 jQuery 环境下，怎么开发 SPA 应用程序，怎么配置路由？

[oyp]

我用 jQuery 很久了，从刚开始的多页面网站开发，到后来转为 SPA ，有时候会用 Electron ，把网页变成一个客户端。

我们知道，jQuery 不像 Vue 或者 React ，可以组件化，也有成熟的路由框架，jQuery 似乎只是为你提供了丰富的工具库，并没有很好地支持单页面应用程序开发。

于是我针对 jQuery ，自己开发了一套路由控制系统，它适合 jQuery ，写得非常简单，但很实用，详情查看：www.wolai.com/oyps/d6YrVHCCqFBPmk9pj4mm1b

我用这套控制系统，开发了很多网站，比如：github.com/oyps/poncon-copyrighted-music

我技术上还比较小白，想寻求一种更好的在 jQuery 环境下实现 SPA 应用开发以及 jQuery 配置前端路由的方案

我学校就教一下 HTML 和基础的 JS ，那些库一个都没讲，据说下学期讲 jQuery ，我 x ，垃圾学校

如果你们知道我学校开的课程有多垃圾，就知道我为什么还在用 jQuery ，并且继续追随 jQuery 了😥

[LIBQ]

第一眼看成了 sap 才点进来的

这种的我建议你不要在网上问了

直接在招聘平台发招聘信息 然后面试时候问相关的技术栈应用更快一点

[oyp]

@LIBQ #1 问题太小白了是吗😂😂😂

[oyp]

@oyp #2 我是不懂就问

[yyfearth]

@oyp jQuery 不是已经可以用 Backbone 来做 SPA 了吗？
组件化和路由 10 年前的东西了
当初比 Angular.js 还更普及来着

[yyfearth]

这么说吧 现在 jQuery 本身的存在价值已经很低了
除非要支持 IE 和上古的浏览器
基本上 jQuery 的绝大部分功能浏览器已经自带了
除非是遗留项目 实在没有继续用 jQuery 的价值

“jQuery 并没有很好地支持单页面应用程序开发”
怎么会呢 当年 jQuery + Backbone + Bootstrap + Require.JS 差不多时间的还有 Ember
SPA 就是这么起来的 然后才有的 Angular.js 再是 React Angular Vue 这些
再古老一点的还有 ExtJS/Sencha

[TomatoYuyuko]

Jquery 和现代框架也不冲突啊，你完全可以借用其他框架的路由，再者 jq 社区当年那么庞大，现成的方案也有你查查就是了

[oyp]

@yyfearth #4 Backbone 是真的没听过，我回去看下历史😂😂😂😂
@TomatoYuyuko #6 确实是
@yyfearth #5 这是以前的技术吗？原来以前还有这种东西，现在都很难听到了，我最近找用 jQuery 去做 SPA 的教程，发现只是说用 location 和 history ，然后就直接说 Vue 和 React ，我现在想要了解一下以前的 SPA 开发教程，应该去哪里找呢？

[oyp]

我希望能使用 jQuery ，把多页面合并起来，用 display 去控制显示，这个不是很复杂，但是要配置路由的话，而且路由的改变要让页面也作出响应，我想用 jQuery 应该怎么做会更好呢？

[skinny]

别想不通

[lesismal]

试试我这个：
github.com/lesismal/pmjs

本人非专业前端，主要原理就是多个页面共存，当前显示谁就把 i 其他的隐藏，纯原生、如果你控场能力强、性能可以做到最强。
代码也不多，有需要的话 OP 可以随便改。

[kop1989smurf]

其实楼主想做的就是通过多个 div 的 show 与 none 来实现所谓的“单页面”。
大概 8 、9 年前做过一个。

需要做的一共是三步：
1 、动态加载 html 添加到主页面中（看了楼主的介绍，应该已经实现了）。
2 、控制界面的生命周期，实现页面的 init 和 callback 事件。
3 、解决 js 、css 的冲突干扰。

2 的话，在过去可以用原型链实现继承，现在已经直接支持继承了。每个页面的 js 均继承一个父类，父类存在 init 函数与 callback 函数，每个页面去分别实现即可。router 中调用对应的 init 、callback 函数。

3 的话，当年我才疏学浅没有解决，靠编码规则规避了。如今看来变量可以利用 js 的作用域、闭包特性来解决。css 样式还没思考到好的方式。

[kop1989smurf]

以上只是几分钟内的思考，肯定有所疏漏，楼主仅供参考。

[cheng6563]

基于 jQuery 的组件不是一堆。。。为啥你不能自己弄组件化。。。

[fox0001]

当年 jQuery 用来屏蔽各个浏览器的 JS 不兼容，确实很好用，但是 IE 都挂了，加上 Webkit 内核大行其道，而且 jQuery 那庞大的体积……感觉没必要折腾 jQuery 了

[fox0001]

@fox0001 #14 修正一下：“Webkit 内核大行其道”改为“ES6 普及”，更为恰当

[oyp]

@lesismal #10 这个我喜欢

[oyp]

@kop1989smurf #12 有点启发了，感谢

[hzxxx]

拿 react-router 用的 router 库来用

[Zzzz77]

jQuery 已经完成了它的历史使命😂真的不值得再去折腾，目前用 jQuery 相比直接写原生 js 已经没有什么优势了。

[zhuweiyou]

jquery.pjax.js
backbone.js

[Rache1]

有 PJAX ，这里 P 指 Page ，不过也是很早的东西了

[runze]

https://www.google.com/search?q=vanillajs+router
https://www.google.com/search?q=jqeury+router
这不是有很多选择吗？

[dagger8224]

@oyp 楼主你好，可以尝试一下 https://daggerjs.org ，使用原生 js 开发 SPA ，连 jQuery 都省了:)

[oyp]

@dagger8224 #23 这个看上去还可以，拿来学习一下

[ztcaoll222]

某大厂内部还在开发的 spa ，现在还用着 jq+ifame+vue😁

[adjusted]

jquery mobile!

[oyp]

主要是我一直在用 Bootstrap 的响应式，手机和电脑都能适应，而之前的 Bootstrap4 是要求 jQuery 的，所以才一直在用 Jquery ，和我界面写的烂也很有关系。现在 Bootstrap5 是可以搭配很多主流框架了，有机会要学一下

[mahone3297]

要什么路由。。。div hide/show 不就解决了

[pytth]

用一个插件可以实现，叫做 InstantClick.js ，我还用这个插件写了一个油猴脚本让所有多页面网站秒变 SPA 。具体看：/t/848726

[pytth]

@pytth 链接 https://v2ex.com/t/848726#reply23

[dagger8224]

@oyp 可以加入 qq 群： https://jq.qq.com/?_wv=1027&k=XxLkXILv 进行讨论哈

[AloneHero]

基本没有学校会教 react/vue ，自己学吧

[YoRolling]

当年拿 jQ+page.js 整过一个小玩具。需要模板引擎就加个模板引擎

[luffy]

别折腾了，直接上 react