Question

我正在使用Django创建一个在线投票系统。我试图将数据库中的候选者的id从客户端返回到服务器端，按照他们向用户显示的顺序。

我使用Django的模板语言将数据添加到<meta>标签，如下所示：

{% for candidate in candidates %}
    <meta id="cand" data-id="{{candidate.id}}" data-order="{{forloop.counter}}">
{% endfor %}

我知道这是不好的做法，但我不知道如何做到这一点。

将值添加到数组时会出现问题。解决这个问题的脚本部分在这里：

var button = $("#send");

$(button).click(function() {

    var metatags = document.getElementsByTagName('meta');
    var cands = [];
    for (var i = 0; i < metatags.length; i++) {
        cands.push(metatags[i].dataset.id);
        // console.log(cands);
    };
    cands = JSON.stringify(cands);
    console.log(cands);

当我这样做时，控制台显示一个包含所有候选ID的数组，但在开头是一个空值。我最好的猜测是为什么<meta>是在页面呈现中以某种其他方式创建的（可能是我使用过的引导程序？），document.getElementsByTagName('meta')正在抓住它。

避免空值的最佳方法是什么？我应该从数组中删除null还是应该以不同的方式收集标记？既然我是一个完整的新手，我该如何实现这些解决方案呢？

Answer 1

你应该对你的选择器更有选择性:-)为了只选择我们的标签而不是任何其他人注入的标签。

如果任何其他元标记不太可能使用data-id，您可以根据该标记进行选择，或data-order如果这提供了更高的项目唯一概率。作为最后的手段，您可以提出一个独特的数据属性。但我会以data-id为例：

<强>替换

var metatags = document.getElementsByTagName('meta');

。通过

var metatags = document.querySelectorAll('meta[data-id]');

这为您提供了额外的好处，即能够在集合上使用.forEach()来简化代码：

var cands = []; document.querySelectorAll('meta[data-id]') .forEach(m=>{cands.push(m.dataset.id); console.log(cands);}); cands = JSON.stringify(cands); console.log(cands);

请注意小改动。它不是存储输出，而是直接用于迭代。

神秘的空值添加到我的数组的开头

1 个答案: