无法加载连接的静态文件源

Question

我是django的新手，最后我学会了在Django中使用静态文件，令我感到宽慰的是，我终于能够在{％static filename.jpg％}中硬编码文件名时加载文件。但是，当我尝试通过用动态文件名替换硬编码的filename.jpg来创建字符串时，我没有得到输出。

不工作的代码片段：

<script>
	image_name = "1.png"	
	static_start = "{% static '"
	static_end =  "' %}"
	image_src = static_start.concat(image_name, static_end)
	window.alert(image_src)	
	var para = document.createElement("img");
	{% load static %}
	para.setAttribute("src", image_src)
	var element = document.getElementById("div_test");
	element.appendChild(para);
</script>

工作代码片段：

 

<script>     
	var para = document.createElement("img");
	{% load static %}
	para.setAttribute("src", "{%static '1.png'%}")
	var element = document.getElementById("div_test");
	element.appendChild(para);
</script>

我想要做的是，我有一堆图像文件，我从某处通过API获取，我将它们存储在静态文件夹中。下载这些图像后，我试图在我的网页上加载它们，因为我正在使用静态文件并动态获取文件名，因为我不知道下载文件的文件名是什么。

关键是字符串连接不起作用，而直接传递字符串是。

真的很感激任何帮助。

P.S。：显然在上面分享的示例中，我只是使用1.png，最终将被我希望显示的文件的名称替换。

使用get_static_prefix工作代码（我实际想要的方式）

<script>
    image_name = "1.png"	   	
    var para = document.createElement("img");
    {% load static %}
    para.setAttribute("src", "{% get_static_prefix %}" + image_name)
    var element = document.getElementById("div_test");
    element.appendChild(para);
</script>

Answer 1

我想我明白你在这里想做什么，但我认为不可能。 Django模板在服务器上呈现，JavaScript在客户端呈现。您正在尝试使用JavaScript创建模板标记，但模板标记不会在客户端评估，它们只是字符串。

Answer 2

所以在提到其他帖子之后，我意识到我做错了什么。我相信有一些关于字符串连接和转义字符不正确的事情，因此Django有get_static_prefix的选项，这是我应该使用而不是那个愚蠢的字符串连接。我已经用正确的工作响应编辑了我的问题，正是我想要的方式。

参考文献：Stackoverflow question，Django tutorial