Django HTML模板中的JavaScript变量 [英] Javascript variables in Django HTML templates

问题描述

我正在写一个Django应用程序，虽然有点熟悉Django我对JavaScript非常陌生。我在我的一个页面中添加了几行JavaScript，以便包含一个地图。

脚本只包括初始化地图，然后根据信息添加标记保存在我的数据库中。

由于存在这么少的代码，将脚本留在HTML模板中仍然被认为是不好的做法，并从我的数据库传递信息使用 {{info}} ？

如果是，您认为哪种方法更好？

解决方案

我假设您建议将JS脚本和将其所需数据放入模板中数据通过字符串插入注入到JS脚本中）

您可以看到如何快速失控。下面我提供代码组织的级别，大致上升顺序（一般来说，进一步改善）

1。包含您的JS使用脚本标签，不嵌入HTML

首先：将JS放入自己的.js文件中，并通过< ;脚本> 标签很简单。所以让我们这样做此外，现代浏览器可以并行加载文件，因此同时加载HTML和JS文件是一个加分。

2。避免使用Django模板将数据输入到JS中

现在我看到人们所做的其他问题是将数据传递到JS中，使用< script> data = {info：something}< / script> 包含他们的JS代码。

其中由于很多原因，不太理想，这源于数据在Django模板中进行字符串插值的事实：

3。让JS通过Django（REST）API拉取数据

然而，既然你说你熟悉Django，我想建议你创建一个返回您的客户端JS需要JSON格式的数据。例如。某些东西在 / api / info 上返回 {info：something} 。

有很多方法可以实现这一点，这里是一个开始（尽管可能已经过时）

然后我将让script.js文件用简单的HTTP GET调用读取数据。许多JS库可以轻松实现。

这种方法的一些优点

• 您的代码（JS部分）独立于数据部分（JSON数据）


• 您可以轻松查看/测试您的JSON中的内容，因为它只是一个HTTP GET请求离开


• 您的HTML / JS部分是完全静态的，因此可缓存，从而提高了加载页面的性能。


• 将Python数据转换为JSON非常简单（无插补功夫）

I'm writing a Django app and while somewhat familiar with Django I'm pretty unfamiliar with JavaScript. I'm adding a few lines of JavaScript into one of my pages in order to include a map.

The script simply encompasses initializing the map and then adding markers according to information saved in my database.

Given that there is so little code, would it still be considered bad practice to leave the script in the HTML template and pass information from my database using {{info}}?

If so, what method would you consider to be better?

解决方案

I assume what you're suggesting is putting both the JS script and its required data into the template (the data being injected into the JS script through string interpolation)

You can see how this can get quickly out of hand. Below I provide levels of code organization, in approximate ascending order (the further you go to better, in general)

1. Include your JS using a script tag, not embedded into the HTML

First: putting the JS into its own .js file and including it via <script> tag is easy. So let's do that. Moreover, modern browsers can load files in parallel, so it's a plus to load the HTML and JS files simultaneously.

2. Avoid feeding the data into the JS using a Django template

Now the other problem I've seen people do is pass the data into the JS using a <script>data = {"info": "something"}</script> before including their JS code.

Which isn't ideal either for many reasons, stemming from the fact that the data is being string-interpolated in the Django template:

3. Make JS pull the data through a Django (REST) API

However since you said you are familiar with Django, I'd like to suggest you create a view that returns the data that your client side JS needs in JSON format. E.g. something that returns {"info": "something"} on /api/info.

There's lots of ways to achieve this, here's a start (albeit might be outdated)

Then I'd have the script.js file read the data with a simple HTTP GET call. Lots of JS libraries can do this for you easily.

Some advantages of this approach

• Your code (the JS part) is independent from the data part (the JSON data)
• You can easily view/test what's being fed into your JSON, since it's just a HTTP GET request away
• Your HTML/JS part is completely static and hence cachable which improves the performance of loading the page.
• The Python data conversion to JSON is pretty straightforward (no interpolation kung-fu)

这篇关于Django HTML模板中的JavaScript变量的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！