Jquery ajax append html file based on url

本文关键字：based on url file html ajax append Jquery 更新时间：2023-09-26

到目前为止，我有一个简单的脚本可以在所有页面上包含少量HTML文件。我想实现的是根据访问者当前所在的 url 中的文件夹包含特定文件并定义这些文件夹名称，例如：

如果/page-1/index-1.html(包括演示 1.html(
如果/page-1/index-2.html(包括 demo-1.html(
如果/random-page/test.html(包括演示 1.html(
如果/page-2/index-1.html(包括 demo-2.html(
如果/page-2/index-2.html(包括 demo-2.html(
如果/another-folder/test.html(包括 demo-2.html(
。等等

目前，我在所有页面上都包含demo-1.html和demo-2.html，但这对我不起作用，因为这两个文件中的内容每个文件夹都不同。我使用的脚本：

$.ajax({ url: "../include/demo-1.html", success: function (data) { $('body').append(data); }, dataType: 'html' });

任何帮助都得到了认可，谢谢:)

在堆栈

溢出用户的帮助下，他在此处找到的类似线程中发布了答案，我想出了一个可行的解决方案(不确定它是否优化得很好，但它有效(：

$(function() {
    var currentURL = window.location.href;
    if(/folder-name/.test(currentURL)) {
        $.ajax({
            url: "../include/demo-1.html",
            success: function (data) { $('body').append(data); },
            dataType: 'html'
        });
    };
    if(/another-folder-name/.test(currentURL)) {
        $.ajax({
            url: "../include/demo-2.html",
            success: function (data) { $('body').append(data); },
            dataType: 'html'
        });
    };
    // etc...
});

希望这对其他人有同样的问题有所帮助。