Django 引用js
时间: 2023-07-23 10:15:18 浏览: 409
要在Django中引用JavaScript,您可以按照以下步骤进行操作:
1. 在Django项目的静态文件目录中创建一个名为 `js` 的文件夹。默认情况下,该目录位于项目根目录下的 `static` 文件夹中。如果 `static` 文件夹不存在,可以手动创建它。
2. 将您的 JavaScript 文件放置在 `js` 文件夹中。例如,创建一个名为 `script.js` 的文件,并将其放置在 `static/js` 目录下。
3. 在您的 Django 模板中引用 JavaScript 文件。假设您要在名为 `example.html` 的模板中引用 `script.js` 文件:
```html
<!DOCTYPE html>
<html>
<head>
<!-- 其他头部内容 -->
</head>
<body>
<!-- 页面内容 -->
<!-- 引用 JavaScript 文件 -->
<script src="{% static 'js/script.js' %}"></script>
</body>
</html>
```
请注意,`{% static 'js/script.js' %}` 是 Django 模板语法,它会根据您的静态文件配置生成正确的 URL。确保在模板文件的顶部使用 `{% load static %}` 来加载静态文件标签。
4. 通过运行 Django 服务器来查看您的模板和 JavaScript 是否正常工作。运行以下命令启动开发服务器:
```
python manage.py runserver
```
然后通过浏览器打开 `http://localhost:8000/example` 以查看模板和 JavaScript 的效果。
这样,您就可以在 Django 中成功引用 JavaScript 文件了。请确保在模板中正确使用静态文件标签,并将 JavaScript 文件放置在正确的静态文件目录中。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![-](https://csdnimg.cn/download_wenku/file_type_column_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)