Question

我还是Node.js的新手，但我会尽力解释我的问题。

所以我正在电影网站上练习我的node.js /表达技巧，我在网站的每一页上都使用了以下元素（img）：

包含统计信息和搜索输入以及导航栏的标题（将在每个页面上重复使用）

以下JS代码是客户端上用于导航到其他网页的两个操作示例，然后在客户端激活GET。

$(function () {

    $('button').click(function (event) {
        event.preventDefault()
        // the value people enter in the search box

        var search = $('.searchInput').val();

        //replace spaces with _
        var res = search.replace(/\s/g, "_");

        //build the URL
        var link = window.location.protocol + '//' + window.location.host + '/search/' + res;

        // redirect to trigger GET in indexjs with specific search value
        window.location.replace(link);

        });

    $('.lists').click(function (event) {
        var link = window.location.protocol + '//' + window.location.host + '/lists/topAll';
        window.location.replace(link);
    })
});

我希望每个页面上的代码都相同。我每次都可以键入相同的代码，但这会浪费时间。对于HTML和CSS，我可以使用模板（HTML）或导入其他CSS文件来节省时间。 JS在客户端有类似的东西吗？

Answer 1

将该代码放入文件中，例如“navigator.js”，然后将其加载到您要使用的每个页面的html标题中

<强> navigator.js：

$(function () {

    $('button').click(function (event) {
        event.preventDefault()
        // the value people enter in the search box

        var search = $('.searchInput').val();

        //replace spaces with _
        var res = search.replace(/\s/g, "_");

        //build the URL
        var link = window.location.protocol + '//' + window.location.host + '/search/' + res;

        // redirect to trigger GET in indexjs with specific search value
        window.location.replace(link);

        });

    $('.lists').click(function (event) {
        var link = window.location.protocol + '//' + window.location.host + '/lists/topAll';
        window.location.replace(link);
    })
});

<强>的index.html

<script src="navigator.js"></script>

最后我建议你为你的按钮指定一个id，例如“searchButton”而不是“button”

希望这有帮助

在客户端重用javascript代码（node.js，express）

1 个答案: