问答

html页面统一绝对路径

作者:admin 2021-05-05 我要评论

如何将所有的html页面引用同一个绝对路径,我不想在每个html的base href="" 中都要写绝对路径(这样如果地址变了所有的页面都要修改很麻烦),怎么实现每个页面...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

如何将所有的html页面引用同一个绝对路径,我不想在每个html的<base href=""> 中都要写绝对路径(这样如果地址变了所有的页面都要修改很麻烦),怎么实现每个页面的头部引用同一个绝对路径变量?求问,怎么实现

###

本身这个属性就是以页面起效的,所以只能每个页面去设置。
如果不想单独设置,可以考虑需要的页面都放置在相同的目录下,这个目录和相对路径有稳定的关系。

###
如果地址变了所有的页面都要修改很麻烦

不太清楚地址为什么会频繁变化。假如你有一个不会变的 base.js,在里面写

const href = "some/path"
$("head").append(`<base href="${href}"/>`)

但是这样每次要先加载一个 js,体验不是很好,考虑 gulp

// gulpfile.js

const {
    src, dest
}                    = require("gulp")
const through2        = require("through2")

const change_base = () => src("path/to/your/*.html") // TODO: 修改路径
    .pipe(through2.obj((fi, _, cb) => {
        if (fi.isBuffer()) fi.contents = Buffer.from(
            // 应该不会有多个 <base>
            fi.contents.toString().replace(/<base[^]*?>/, () =>
                `<base href="${ process.argv[1] }"/>`
            )
        )
        cb(null, fi)
    }))
    .pipe(dest("path/to/your")) // TODO: 修改路径
    
module.exports = {
    change_base
}

然后就可以很舒适地使用:

$ gulp change_base some/path

未经检验,可能有错

没有安装 gulp 的话

$ npm i -g gulp # 全局也装一个吧
$ npm i -D gulp
$ npm i -D through2 # 是脚本需要的插件

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • html页面统一绝对路径

    html页面统一绝对路径

  • vue追加数据怎么不刷新

    vue追加数据怎么不刷新

  • 如何识别一个DO模型的字段的内容改变?

    如何识别一个DO模型的字段的内容改变?

  • 如何在数组内一个元素引用另一个元素?

    如何在数组内一个元素引用另一个元素?

腾讯云代理商
海外云服务器