对Django中static(静态)文件详解以及{% static %}标签的使用方法


Posted in Python onJuly 28, 2019

在一个网页中,不仅仅只有一个html骨架,还需要css样式文件,js执行文件以及一些图片等。因此在DTL中加载静态文件是一个必须要解决的问题。在DTL中,使用static标签来加载静态文件。要使用static标签,首先需要{% load static %}。

加载静态文件的步骤如下:

首先确保django.contrib.staticfiles已经添加到settings.INSTALLED_APPS中。

确保在settings.py中设置了STATIC_URL。

注意: 上面两条都是在创建Django 项目的时候就自动给我们弄好了,只要我们没有去改动它,就不用管。

在已经安装了的app下创建一个文件夹叫做static,然后再在这个static文件夹下创建一个当前app的名字的文件夹,再把静态文件放到这个文件夹下。例如你的app叫做book,有一个静态文件叫做book.jpg,那么路径为book/static/book/book.jpg。(为什么在app下创建一个static文件夹,还需要在这个static下创建一个同app名字的文件夹呢?原因是如果直接把静态文件放在static文件夹下,那么在模版加载静态文件的时候就是使用book.jpg,如果在多个app之间有同名的静态文件,这时候可能就会产生混淆。而在static文件夹下加了一个同名app文件夹,在模版中加载的时候就是使用app名/book.jpg,这样就可以避免产生混淆。)

注意: 文件夹的名字必须为static 。

如果有一些静态文件是不和任何app挂钩的。即不再任何一个app的目录下。那么可以在settings.py中添加STATICFILES_DIRS,以后DTL就会在这个列表的路径中查找静态文件。例如我们在manage.py的同级目录下新建一个static的文件夹。然后在settings.py:中添加STATICFILES_DIRS

STATICFILES_DIRS = [
 os.path.join(BASE_DIR,"static")
]

注: 第三种和第四种方法都可以加载静态文件,我的个人习惯是在manage.py的同级目录下新建一个static文件夹,然后将所有的静态文件进行分类的在里面存储。而不去app中新建一个static的文件夹。但这只是我的个人习惯。毕竟不管是黑猫白猫,能抓到老鼠的就是好猫,所以只要我们能把项目做出来能运行,并且代码结构有逻辑性、层次感就行了。

在模版中使用load标签加载static标签。比如要加载在项目的static文件夹下的style.css的文件。那么示例代码如下:

{% load static %}

<link rel="stylesheet" href="{% static 'style.css' %}" rel="external nofollow" >

注意: {% load static %}需要放在html的头部位置(至少在使用static标签的上面),一般都是放在html的最上面。如果{% extend %}标签和{% load static %}同时存在,{% extend %}需要放在最上面,然后再放{% load static %}等标签。

如果不想每次在模版中加载静态文件都使用load加载static标签,那么可以在settings.py中的TEMPLATES/OPTIONS添加'builtins':['django.templatetags.static'],这样以后在模版中就可以直接使用static标签,而不用手动的load了。

注意: 位置不要添加错误了

TEMPLATES = [
  {
    'BACKEND': 'django.template.backends.django.DjangoTemplates',
    'DIRS': [os.path.join(BASE_DIR, 'templates')]
    ,
    'APP_DIRS': True,
    'OPTIONS': {
      'context_processors': [
        'django.template.context_processors.debug',
        'django.template.context_processors.request',
        'django.contrib.auth.context_processors.auth',
        'django.contrib.messages.context_processors.messages',
      ],
      #添加在这个位置
      'builtins' : [
        'django.templatetags.static'
      ],
    },
  },
]

下面的不常用,但是可以了解一下。

如果没有在settings.INSTALLED_APPS中添加django.contrib.staticfiles。那么我们就需要手动的将请求静态文件的url与静态文件的路径进行映射了。

示例代码如下:

from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [
 # 其他的url映射
] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)

但平时我们并不会用到这个,Django内置已经将django.contrib.staticfiles添加进去了的,我们为什么要给他删除来自找麻烦呢?放在这里也只是提供一个参考,了解一下。

最后分享一个快捷键的使用:在我们写项目的时候,有时候修改了代码而没有效果,这是因为浏览器使用的缓存加载,这个时候我们就可以使用这个快捷键来不使用缓存加载一个文件,来达到查看修改代码之后的效果的目地。

ctrl+shift+r 不使用缓存加载一个文件

以上这篇对Django中static(静态)文件详解以及{% static %}标签的使用方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Python 相关文章推荐
分享Python开发中要注意的十个小贴士
Aug 30 Python
Python入门之三角函数tan()函数实例详解
Nov 08 Python
Python实现读取txt文件中的数据并绘制出图形操作示例
Feb 26 Python
python异步存储数据详解
Mar 19 Python
opencv3/python 鼠标响应操作详解
Dec 11 Python
Python lxml模块的基本使用方法分析
Dec 21 Python
Pytorch之保存读取模型实例
Dec 30 Python
Python3.7下安装pyqt5的方法步骤(图文)
May 12 Python
python适合做数据挖掘吗
Jun 16 Python
Python如何实现后端自定义认证并实现多条件登陆
Jun 22 Python
Pytorch学习之torch用法----比较操作(Comparison Ops)
Jun 28 Python
python xlwt模块的使用解析
Apr 13 Python
解决Django Static内容不能加载显示的问题
Jul 28 #Python
基于Django静态资源部署404的解决方法
Jul 28 #Python
Python占用的内存优化教程
Jul 28 #Python
解决Django加载静态资源失败的问题
Jul 28 #Python
django之静态文件 django 2.0 在网页中显示图片的例子
Jul 28 #Python
python正则-re的用法详解
Jul 28 #Python
django ModelForm修改显示缩略图 imagefield类型的实例
Jul 28 #Python
You might like
咖啡风味 世界咖啡主要分布分布 咖啡的生长要求
2021/03/06 新手入门
留言板翻页的实现详解
2006/10/09 PHP
php微信开发之百度天气预报
2016/11/18 PHP
php实现文件管理与基础功能操作
2017/03/21 PHP
ThinkPHP5.0框架结合Swoole开发实现WebSocket在线聊天案例详解
2019/04/02 PHP
详解Laravel设置多态关系模型别名的方式
2019/10/17 PHP
图片连续滚动代码[兼容IE/firefox]
2009/06/11 Javascript
一句话JavaScript表单验证代码
2009/08/02 Javascript
JavaScript strike方法入门实例(给字符串加上删除线)
2014/10/17 Javascript
jQuery实现的网页左侧在线客服效果代码
2015/10/23 Javascript
Javascript的表单与验证-非空验证
2016/03/18 Javascript
炫酷的js手风琴效果
2016/10/13 Javascript
老生常谈jquery中detach()和remove()的区别
2017/03/02 Javascript
vue音乐播放器插件vue-aplayer的配置及其使用实例详解
2017/07/10 Javascript
JS去掉字符串中所有的逗号
2017/10/18 Javascript
js for终止循环 跳出多层循环
2018/10/04 Javascript
Node.js Windows Binary二进制文件安装方法
2019/05/16 Javascript
JS实现继承的几种常用方式示例
2019/06/22 Javascript
如何利用node.js开发一个生成逐帧动画的小工具
2019/12/01 Javascript
JavaScript图片旋转效果实现方法详解
2020/06/28 Javascript
python开发简易版在线音乐播放器
2017/03/03 Python
matplotlib subplots 设置总图的标题方法
2018/05/25 Python
使用PyQtGraph绘制精美的股票行情K线图的示例代码
2019/03/14 Python
python3 tkinter实现添加图片和文本
2019/11/26 Python
关于Python字符串显示u...的解决方式
2020/03/06 Python
Python如何批量生成和调用变量
2020/11/21 Python
python 监控服务器是否有人远程登录(详细思路+代码)
2020/12/18 Python
python statsmodel的使用
2020/12/21 Python
关于工资低的辞职信
2014/01/14 职场文书
化妆品店促销方案
2014/02/24 职场文书
党员学习群众路线心得体会
2014/11/04 职场文书
全国助残日活动总结
2015/05/11 职场文书
Redis实现订单自动过期功能的示例代码
2021/05/08 Redis
详解nginx进程锁的实现
2021/06/14 Servers
3050和2060哪个好 性能差多少 差距有多大 谁更有性价比
2022/06/17 数码科技
JS前端可视化canvas动画原理及其推导实现
2022/08/05 Javascript