javascript - 关于js脚本之间数据交互问题

Question

比如a.html是一个文章阅读界面，该页面有一个“编辑”按钮，点击后会跳转到文章编辑界面b.html。
1）由于b.html里面必须由js来渲染(此页面有些逻辑已经通过js实现，所以不想再由后端再实现一次)，所以就决定了“编辑”按钮点击时得通过ajax发送请求。
2）基于以原因，a.html里面引用的是a.js(a.html里面的很多逻辑都是a.js实现的),b.html里面引用的是b.js(b.html里面的很多逻辑也是由b.js实现的)。为了统一代码，我想把编辑的ajax请求代码放在a.js中。
3）那么问题来了，a.js发送请求后获得响应的文章的标题啊内容啊分类啊之类的信息怎么传给b.js，然后由b.js渲染b.html

---各位大神，请指教，不知道我的这种设计合理否，请尽量基于这个方案提出一些好的办法，或者有更优雅的方案也可

Answer 1

方案1，抽出ajax请求的js，封装成方法，a、b页面分别加载此js，调用此方法获取数据，渲染页面
方案2，a.js获取后存到浏览器缓存中（session、cookie、local），b.js从中获取，但需要考虑，如果用户直接输入url到b页面，那么是取不到缓存的，此时仍需再重新ajax请求
方案3，改为单页应用，使用react、vue等框架的状态管理（redux、vuex）

通常方案1即可

Answer 2

localStorage

Answer 3

上MVC或者MV*框架吧

把ajax请求抽取出来，已经是经典的Module模块了。

建议再结合session（local不手动清除的话，会一直留着内存中，新开一个page都可以访问的到。），已经request的数据存在session中，没有的再去做ajax请求。可以减少对服务端的请求数量。

Answer 4

对你的描述我不是很明确你想要干什么，不过有两点

1. 如果你是想共用一部分代码，可以用模块化的思想，把 a.js 和 b.js 中共用的部分提取出来，写成一个模块。对于整个项目来说，可以把大家的公共部分都提取出来，编译成一个 js 文件作为共用库引用。

2. 如果你是想共用一部分数据，从 a.html 传递给 b.html 最直接的办法就是 localStorage。不过需要注意一点，如果没打开 a.html，直接打开了 b.html，localStorage 里可能也会保存着上次打开 a.html 的数据，所以最好再记录一下获取数据的时间用于判断。

不过 ajax 请求也是可以缓存的，如果是 URL 不变参数不变的 GET 请求，可以在 a.html 和 b.html 里都请求，浏览器会自动判断要不要从缓存中去取数据。

Answer 5

-->更加实际的解决方案
楼上几个人说的是常见的解决方案，但是就你这个问题我觉得更好的解决方案是将ab两个界面合并，通过事件触发显示切换，这样一来，你并不需要加载两个js，也不需要两个页面，同时数据传输也不是问题。
-->更高级的解决方案
我有看到你这是查看和编辑对吧，那么你甚至可以只要一个查看页面，点击编辑按钮后使用新的函数重新渲染下页面即可。但是这个方案的难点在于你需要相当强悍的css功底，能够让查看和编辑两种模式在同样的html结构下呈现你需要的显示。但是可行性是绝对可以

Answer 6

我的个人理解,如果有解读题意出错的地方,还请指出:

在a.js发送的请求回来的数据啊标题啊之类的,想传递到b.html页面,那
为何不点击编辑的时候直接跳转到b.html 在b.html中发送那个请求呢?
我没太理解你想统一代码这个概念~~

另外如果有些参数是a.js有的,那就在点击的时候放在b.html后面传递过去,或者使用localstory来存储,仍然在b.js页面做请求.

如果你想把所有请求统一写在a.js页面,
这不科学,
因为你不可能只有这几个请求,
网站中遍地是请求,
如果现在就写的这般限制,那么以后维护起来必定艰难.