나머지 프로 -32번째 HTML 하위 요소 획득~

4331 단어 jinja2

for문의 HTML 인식


task.csv



.html


Jnja2로 구성된 템플릿 포문을 마지막으로 사용했습니다.
id를 지정할 때 개별적으로 사용하지 않고 템플릿을 사용하면 편의성이 향상됩니다.
<tbody>
    {% for task in tasks_csv[1:] %}
    <tr id={{ task[0] }}>
        <th scope='row'>{{ task[1] }}</th>
        <td>{{ task[2] }}</td>
        <td>{{ task[3] }}</td>
        <td>{{ task[4] }}</td>
        <td>{{ task[5] }}</td>
        <td>
            <div class="form-group">
                <select class="form-control" onchange="replaceForm();">
                    <option value="">-</option>
                    <option value="Edit">Edit</option>
                    <option value="Delete">Delete</option>
                </select>
            </div>
        </td>
    </tr>
    {% endfor %}
</tbody>

<script>
    let row;
    let select;
    let col_1;
    let tasks = {{ tasks_csv|tojson }}
    let len = tasks.length

    function replaceForm(){
        for (let i=1; i<len; i++){
            row = document.getElementById(tasks[i][0]);
            console.log(row.children)
        }
    }
</script>
여기서 주의해야 할 것은 자바스크립트의 함수에서 Jnja2의 템플릿을 사용할 수 없으며, 그룹을 다시 준비하고 json화한 후에 대입해서 사용할 수 있다.

좋은 웹페이지 즐겨찾기