在Html中使用Requirejs进行模块化开发的解析(2)-木庄网络博客

2022-02-22 11:04:37 PHP中文网 JavaScript 百度已收录

那么，前端的代码可能会这样：

<html>
<body>
<nav>
导航按钮1、导航按钮2、导航按钮3
</nav>
<p style="display:block">按钮1对应的页面</p>
<p style="display:none">按钮2对应的页面</p>
<p style="display:none">按钮3对应的页面</p>
</body>
</html>

这样的代码会很杂乱...而且前端Html会很长...不利于维护。

那么有了reuqirejs的text插件以后，就可以这样了：

<html>
<body>
<nav>
导航按钮1、导航按钮2、导航按钮3
</nav>
<p id="target"></p>
</body>
</html>

然后在对应的模块中：

1	`$('#target').html(require("text!目标按钮对应的页面.html"));`

这样就随性多了吧！前端代码也可以跟着模块一起有效的管理了！

不过需要注意的是：这种方式会导致Jquery绑定的事件失效――所以一定要在html()方法后面，重新绑定下事件。

关于在Html中使用Requirejs进行模块化开发的相关知识就给大家介绍这么多，希望对大家有所帮助！

以上就是本文的全部内容，希望对大家的学习有所帮助，更多相关内容请关注PHP中文网！

Vue.js 设计与实现基于Vue.js 3 深入解析Vue.js 设计细节

￥83.86元 人民邮电出版社

本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者

转载请注明出处：木庄网络博客 » 在Html中使用Requirejs进行模块化开发的解析

在Html中使用Requirejs进行模块化开发的解析

Vue.js 设计与实现基于Vue.js 3 深入解析Vue.js 设计细节

相关推荐

评论