javascript文件中的Django{%static'；path'；%}

在my script.js中：

pic.src = "/static/photos/1.jpg"; // This works
pic2.src = "{% static 'photos/1.jpg' %}" // Does not work

这到底是为什么？因为在my home.html中，{%static'路径“}起作用：

{% load staticfiles %}
<script src="{% static 'script.js' %}"></script>  // This works

{%load staticfiles%}
//这很有效

---

是{%load staticfiles%}还是{%load static%}？这两种方法都适用于我，script.js已加载。

您可以在模板中指定路径，然后在javascript文件中使用它

模板：

<script>
    var url = "{% static 'photos/1.jpg' %}";
</script>

---

因为您使用的是django的模板语言，所以您只能在

标记之间的模板内执行此操作。换句话说，如果您希望在外部脚本中使用

pic2.src

javascript变量，那么您需要在

标记之间声明它，如下所示

<script>
    var pic2.src = "{% static "photos/1.jpg" %}"
</script>

var pic2.src=“{%static”照片/1.jpg”%}

然后您可以在外部脚本中访问它，您可以这样加载：

<script type="text/javascript" src="{% static "js/my_external_script.js" %}"></script>

关于

加载静态文件

和

加载静态文件

的问题，没有什么区别。两者都充当

settings.py

中的

STATIC\u URL

和文件本身的实际路径的联接者，因此两者都适用于您的情况。有关更多信息，请参阅和。

如果您需要在

.js

文件中包含许多静态（或媒体）url，这可能更方便：

<script>
    var static_url = "{% get_static_prefix %}";
    var media_url = "{% get_media_prefix %}";
</script>

var static_url=“{%get_static_prefix%}”；
var media_url=“{%get_media_prefix%}”；

然后这两个url都可以在所有javascript文件中免费使用

简易解决方法！：）

index.html

<input type="hidden" id="pic-src" value="{% static 'photos/1.jpg' %}">

---

是的，因为html文件是一个模板，但静态文件不被视为模板。感谢您的快速回复Simeon！所以pic.src=“static/photos/1.jpg”是唯一的方法？如果您真的希望从模板/视图中呈现javascript，您可以很容易地做到这一点。但这可能不是你想要的。更可能的情况是，您希望js的大部分是静态文件，然后在元素的模板底部添加视图特定的代码。这将导致collectstatic在部署时出现问题。@NK什么样的问题？我认为这样创建URL会导致问题-对于任何未使用{%static%}创建的URL，没有收集资源。但我后来发现问题出在其他方面，这些可能是在后处理阶段收集的。但是，它不会在部署时使用清单存储启用缓存破坏，因为您将有一个未清除的引用。这些不应该被

{%filter escapejs%}…{%endfilter%}包围吗

？需要注意的是，如果您使用云服务来存储静态文件（例如AWS S3），那么

加载静态文件

和

加载静态文件

之间会有很大的区别，这让我多次感到困惑

staticfiles

动态获取存储文件的正确后端，而

static

始终使用默认值。如果您使用

静态

而不是

静态文件

，那么您的代码在aws中将无法正常工作。这些文件不应该被

{%filter escapejs%}…{%endfilter%}

包围吗？这些文件不应该被

{%filter escapejs%}…{%endfilter%}

包围吗？

<input type="hidden" id="pic-src" value="{% static 'photos/1.jpg' %}">

var pic2.src = $('pic-src').val();