发表新帖
发表新帖

Javascript variables in Django HTML templates

后端 未结
关注
3 1984
甜味超标
甜味超标 2021-01-19 03:41

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 orde

相关标签:
3条回答
  • -上瘾入骨i
    2021-01-19 04:00

    In my Django projects, if I am using a "base" template that every other template extends, I just put a block called "extrahead" inside of the <head></head> in the HTML.

    <html>
    <head>
        ........ other header stuff
        ........ include other scripts
        {% block extrahead %}
        {% endblock %}
    </head>
    .............
</html>

    ... and then use that block just in the template you want the map on. That is assuming that it is just static js code?

    0 讨论(0)
  • 误落风尘
    2021-01-19 04:10

    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)
    0 讨论(0)
  • 野的像风
    2021-01-19 04:11

    Yep that's bad practice.

    Consider defining static folder for your app as described on official django documentation page: Managing static files and upload your js via static template tag.

    You could get data which in {{ info }} variable by creating separate django view which would return JsonResponse and then perform AJAX Request to fetch desired data from newly createdd js file.

    0 讨论(0)
 看不清?
提交回复
热议问题