javascript - 更改javascript nodejs中所有页面中的href url

标签 javascript html ajax navbar

我已经实现了具有多种语言下拉菜单的引导导航栏,当我选择语言时,它会翻译页面,如何更改其他页面的 url 和按钮文本 当我选择 french 时,将所有 url 更改为 /fr/about/fr/contact。 如何使用 javascript

//app.js
var express = require('express');
var app = express();
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs')
var languageRouter = require('./routes/language');

app.use('/:lan', languageRouter);
app.use('/:lan/contact', contactusRouter);
app.use('/:lan/aboutus', aboutusRouter);
//language.js
var express = require('express');
var router = express.Router();
router.get('/', function (req, res) {
    res.render('index.ejs'});
});
module.exports = router;
//aboutus.js
var express = require('express');
var router = express.Router();
router.get('/', function (req, res) {
    res.render('aboutus.ejs');
});
module.exports = router;
//header.ejs
<body>
  <nav>
    <div class="dropdown">
 <ul class="navbar-nav mr-auto">
            <li class="nav-item dropdown mr-4">
                <a class="nav-link dropdown-toggle" href="/en/about" id="navbarDropdownProvider" data-toggle="dropdown"
                    aria-haspopup="true" aria-expanded="false">
                   about us
                </a>
</li>
<li class="nav-item dropdown mr-4">
                <a class="nav-link dropdown-toggle" href="/en/contact" id="navbarDropdownProvider" data-toggle="dropdown"
                    aria-haspopup="true" aria-expanded="false">
                   contact us
                </a>
</li>
</ul>
      <button id="language" class="btn btn-warning dropdown-toggle" type="button" id="dropdownMenu2"
        data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" onclick="clickButton()">
        English
      </button>
      <div id="languagelist" class="dropdown-menu" aria-labelledby="dropdownMenu2" onclick="clickItem(); return false">
        <a class="dropdown-item" href="/en">English</a>
        <a class="dropdown-item" href="/fr">French</a>
      </div>
    </div>
  </nav>
</body>
//index.ejs

  <%- include header.ejs %>
  <h1>Welcome to My Site</h1>

最佳答案

应该可以用 express 来“嵌套”路由。 (例如,查看此答案 Rest with Express.js nested router)

在你的情况下,我认为这意味着你的旧代码

var languageRouter = require('./routes/language');

app.use('/:lan', languageRouter);
app.use('/:lan/contact', contactusRouter);
app.use('/:lan/aboutus', aboutusRouter);

变成这样:

var languageRouter = require('./routes/language');

app.use('/:lan', languageRouter);
languageRouter.use('/:lan/contact', contactusRouter);
languageRouter.use('/:lan/aboutus', aboutusRouter);

关于javascript - 更改javascript nodejs中所有页面中的href url,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56729053/

相关文章:

javascript - 位于弹出图像右上角的关闭按钮

javascript - 如何通过从浏览器 js 控制台触发的 require.js 重新加载文件

css - 使我的 css 框的高度液化

javascript - 当我单击 div 时,div 应该刷新并且应该显示刷新的数据

html - Ajax 表单提交,无法弄清楚为什么它不起作用

javascript - 为什么复选框在取消选中时不在 onchange 上提交任何数据

javascript - 在 JSON 中指定正则表达式字符串,在 JavaScript 和 PHP 中使用它

javascript - 我的服务没有更新 - Angularjs

javascript - 如何用另一个 div 隐藏动画 div

html - CSS/前 :empty with non-empty pre contents