Добавление тегов img в шаблон Django с использованием Javascript - PullRequest
Новая
       12

Добавление тегов img в шаблон Django с использованием Javascript

0 голосов
/ 20 июня 2020

Привет, я пытаюсь создать сайт в django. Для одной страницы на веб-сайте я хочу иметь каталог, поэтому мне нужно загрузить большую таблицу, используя javascript. Console.log - это правильный синтаксис тега img, но изображения не загружаются.

Это мой javascript код: catolog. js

function makeList() {
    listData = Array.from(Array(43).keys()); 
    // Add it to the page
    content1 = document.querySelectorAll(".tg-0lax");
    var count = 0;
    var td;
    for (td of content1){
            console.log(td);
            text =   'images'+ '/'+ 'image_' + count + '.jpg';
            console.log(text);
            img = " src= \"{ % static '" + text + "' % }\"";
            str = '<img ' + img + '>';
            console.log(str);
        td.innerHTML = str;
        count = count + 1;
    }
}
makeList();

Это мой html файл 

{% extends "storeApp/base.html" %}
{% block content %}
{%load static%}

<style>
article{
        text-align: center;

}
</style>
<div class="content1" id="data-point-1">
        <style type="text/css">
.tg  {border-collapse:collapse;border-spacing:0;}
.tg td{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;
  overflow:hidden;padding:10px 5px;word-break:normal;}
.tg th{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;
  font-weight:normal;overflow:hidden;padding:10px 5px;word-break:normal;}
.tg .tg-0lax{text-align:left;vertical-align:top}
</style>
<table class="tg" onload="makeList()">
<thead>
  <tr>
    <th class="tg-0lax"></th>
    <th class="tg-0lax"></th>
    <th class="tg-0lax"></th>
  </tr>
</thead>
<tbody>
  <tr>

. . . 

  </tr>
</tbody>
</table>
<script src={% static 'js/catolog.js'%}>

</script>

</div>




{% endblock %}
...