利用jquery对HTML中的名字进行替代

原创已于 2023-11-20 22:15:27 修改 · 779 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#jquery #html #前端

于 2023-11-16 15:01:02 首次发布

JavaScript 专栏收录该内容

7 篇文章

订阅专栏

文章讨论了在Web项目中使用Django框架时，通过jQuery编写JavaScript来动态修改网页标题的方法，强调了利用模板标签变量的便利性，并给出了具体代码示例。

昊虹君2023-11-20 22:13:53注：这种方法还是不如用Django的模板标签变量的方法，因为你的web项目反正也是要用Django开发，那既然这样，为什么不用Django的模板标签变量的方法呢？

想法：将网页中经常要修改的名字放在一个以jquery编写的js文件中，如果需要修改名字，直接修改js文件中的名字即可。

新建name_07.html文件，写入下面的代码：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>it is title</title>
    <meta name="viewport" content="width=device-width,initial-scale=1, shrink-to-fit=no">
    <script src="E:/HTML_code/static/jquery-3.5.1.slim.js"></script>
</head>
<body>

<h1 id="title01"></h1>
<h2 id="title02"></h2>
<h3 id="title03_1"></h3>
<h3 id="title03_2"></h3>

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

</body>
</html>

再在name_07.html所在目录下新建文件namelib07.js，并写入下面的代码：

$(document).ready(function() {
    var title01str = "这是标题01";
    var title02str = "这是标题02";
    var title03str = "这是标题03";

    $("#title01").text(title01str);
    $("#title02").text(title02str);
    $("#title03_1").text(title03str);
    $("#title03_2").text(title03str);

});