在 mysite 文件夹下添加一个 statics 文件夹用来存放 js 文件

在 index.html 文件中添加

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

<form action="/userInfo" method="post">

    <p>名字<input type="text" name="username"></p>

    <p>性别<input type="text" name="sex"></p>

    <p>邮箱<input type="text" name="email"></p>

    <p><input type="submit" value="submit"></p>

</form>

<hr>

<h1>数据展示</h1>

<table border="1px">

    <tr>

        <td>名字</td>

        <td>性别</td>

        <td>邮箱</td>

    </tr>

    {% for i in user_list %}

    <tr>

        <td>{{ i.username }}</td>

        <td>{{ i.sex }}</td>

        <td>{{ i.email }}</td>

    </tr>

    {% endfor %}

</table>

</body>

<!-- 新添加 -->

{% load static %}

<script src="{% static "jquery-3.3.1.min.js" %}" ></script>

<script>

    $("h1").css("color","red")

</script>

<!-- 新添加 -->

</html>

在 urls.py 文件中添加

from django.contrib import admin

from django.urls import path

from blog import views

from django.conf import settings

from django.conf.urls.static import static

urlpatterns = [

    path('admin/', admin.site.urls),

    path('userInfo', views.userInfo),

] + static(settings.STATIC_URL, document_root=settings.STATICFILES_DIRS)

在 settings.py 中添加

# 在 STATIC_URL = '/static/' 下面添加，STATIC_URL 相当于一个别名，给前端使用，映射 statics 文件夹(该文件夹名字可更改)；前端调用就使用 /static/jquery-3.3.1.min.js。与文件夹名字无关。

STATICFILES_DIRS=[

    os.path.join(BASE_DIR, "statics"),

]

Django 项目中添加静态文件夹的更多相关文章

  1. 擦他丫的，今天在Django项目中引用静态文件jQuery.js 就是引入报错，终于找到原因了！

    擦 ,今天在Django项目中引用静态文件jQuery.js 就是引入报错,终于找到原因了! 问题在于我使用的谷歌浏览器,默认使用了缓存,导致每次访问同一个url时,都返回的是缓存里面的东西.通过谷歌 ...

  2. Django settings.py添加静态文件夹

    我们需要一个静态文件夹来存放文件,例如jQuery的模块 <script src="statics/jquery-3.2.1.js"></script> 引 ...

  3. delphi项目中的modelsupport文件夹

    delphi项目中的modelsupport文件夹 今天写着写着突然发现多了一个这个文件夹..苦思不得其解  看着又难受  删了又重建 终于找到了  存此备查;Tools--option--toget ...

  4. [翻译]在Django项目中添加谷歌统计(Google Analytics)

    原文:<Google Analytics tracking code into Django projects, the easy way> 对我来说,制作一个可扩展的Django应用随时 ...

  5. Django项目中添加富文本编辑器django-ckeditor

    django-ckeditor库的使用步骤: 1.在命令行下安装django-ckeditor这个库: 命令:pip install django-ckeditor 2.安装成功后,配置Django项 ...

  6. django框架中的静态文件引入

    首先在项目文件中新建文件夹static 之后在settings.py中配置路径 如下图所示: 下一步在你刚创建的static文件夹中添加app的文件夹名称,例如:teacher,如下图: 之后在tea ...

  7. maven项目中没有resource文件夹的问题

    之前使用eclipse创建maven项目,文件夹都是建好的,这几次创建,都没有resource文件夹,需要手动创建resource. 现象描述 在eclipse中,创建maven项目有两种方式: 一种 ...

  8. netbeans项目中排除node_modules文件夹

    由于项目中的javascript使用了gulp编译技术,所以在web目录下有js的源码目录,其中又有gulp所使用的nodeJS模块,node_modules下面小文件很多,所以造成netbeans扫 ...

  9. github 删除远程仓库项目中的任意文件夹

    今天上传代码把不需要的push上去了.结果想删除那个不想要的怎么弄都不行.网上大部分都是把那个项目整个暴力删除.那可不行啊那么多都删除.下次上传不是要命啊! 试啊试终于解决了.顺便记录一下也帮助下需要 ...

随机推荐

  1. asp.net core系列 57 IS4 使用混合流(OIDC+OAuth2.0)添加API访问

    一.概述 在上篇中,探讨了交互式用户身份验证,使用的是OIDC协议. 在之前篇中对API访问使用的是OAuth2.0协议.这篇把这两个部分放在一起,OpenID Connect和OAuth 2.0组合 ...

  2. Stackoverflow上有哪些声望高or值得关注的国人

    Stackoverflow上有哪些声望高/值得关注的国人? 以下回答并不严格按照 Reputation 排名来列,也不收录不确定是Chinese(中国人或华人)的用户,欢迎补充- 1.李杨 @Li L ...

  3. kube-proxy的功能

    Kube-proxy的功能 我们知道POD的IP是动态分配的而且经常会变,所以为了可以通过一个不太容易变化的IP访问POD就会使用一个叫做service的东西,通过标签选择器和POD进行关联. Ser ...

  4. 企业级镜像仓库harbor搭建

    企业级镜像仓库harbor搭建 一．    Harbor概述 VMware公司最近开源了企业级Registry项目Harbor,其的目标是帮助用户迅速搭建一个企业级的Docker registry 服 ...

  5. ansible工具

    关于ansible 在ansible官网上是这样介绍ansible的:Ansible is an IT automation tool. It can configure systems, deplo ...

  6. 免费开源ERP-成功案例分析（1）

    Odoo用户案例 Odoo用户概要 关于Odoo全球的用户,我们来看一些数据: Odoo目前全球有300万使用者 Odoo系统上每天新创建的数据库超过1000个 Odoo和Word.Excel.Pow ...

  7. Proj.Net 投影介绍

    Proj.Net是开源地图投影库Proj.4的.net版本,许多GIS开源软件的投影都直接或间接地使用Proj.4的库,Proj.4是用C语言编写..Net下的开源GIS项目NetTopologySu ...

  8. 基于开源CA系统ejbca community 6.3.1.1构建私有CA管理数字证书

    最后更新于2017年01月24日 一.为什么 为什么写这篇文章?ca是什么?数字证书是什么?ejbca又是什么? 让我们从http与https说起.http是超文本传输协议(HyperText Tra ...

  9. shell 编程记录

    1 文件比较运算符-e filename 如果 filename存在,则为真 [ -e /var/log/syslog ]-d filename 如果 filename为目录,则为真 [ -d /tm ...

  10. Linux 桌面玩家指南：18. 使用 Docker 隔离自己的开发环境和部署环境

    特别说明:要在我的随笔后写评论的小伙伴们请注意了,我的博客开启了 MathJax 数学公式支持,MathJax 使用$标记数学公式的开始和结束.如果某条评论中出现了两个$,MathJax 会将两个$之 ...