用JS解决html页面间获取context-path问题

用JS解决html页面间获取context-path问题

问题说明：

我使用springboot+vscode写了一个前后端分离的demo，前台页面都是html,里面各种api调用和路径跳转。

例如：http://localhost:8888

我不想每一个都写么一堆，所以可以写一个js文件，把公共部分抽取出来，供各个html页面使用！（用时记得导入js文件）

下面放上代码：

urls.js:

var ctx = 'http://localhost:8888';

index.html:(部分代码):

<script src="js/jquery.js"></script>//JQ   
<script src="js/urls.js"></script>//自己封装的JS文件
<script>
                $(function() {
                            $.ajax({
                            url: ctx+"/news/get", //json文件位置
                            type: "GET", //请求方式为get
                            dataType: "json", //返回数据格式为json                  
                            //contentType: "application/json; charset=utf-8",				
                            success: function(data) { //请求成功完成后要执行的方法 
                            var data = data.data
                                var html = "";
                                
                            $.each(data, function(i, item) { //这里的函数参数是键值对的形式，i代表键名，item代表值                                                              
                                html += '<li> ';
                                html += ' <a href="https://www.kaitao.cn/article/20190228161752.htm" target="_blank">';
                                html += '<img src="static/picture/' + item.fileName + '" alt="拼多多直通车100%卡位成功技巧实操分享" />' + item.title + '</a></li> ';               
                            });
                            $(".news-list").append(html);
                            }
                       })
                        })
                
            </script>

其中url处拼接的地址，经过测试，可以使用！

总结：

1. 按需写一个js文件，给对象赋值一个地址
2. 在html页面导入这个js文件，在url处，采用自己封装的对象
3. 解决问题，根据需要想怎么改就怎么改！

我是初学者，在学习是发现了一个大牛，下边放上他写的关于thymeleaf利用fragment解决html页面间获取context-path问题。

点击此处跳转thymeleaf利用fragment解决html页面间获取context-path问题