还有另一种方法可以使用“标签”类在跨度中循环数组

时间:2019-01-02 20:07:47

标签: javascript html css arrays loops

我正在设置本地服务器,并希望为字典(数组)创建一个循环,以便将结果以跨度的形式显示在“标签”类中。这样以后就可以像按钮一样使用了。但是代码没有循环,我的问题是是否还有另一种方法可以循环该代码

我已经写了几次代码,但是代码不起作用,即使浏览器的控制台也没有显示错误

$event->slug_str = $this->generateBarcodeNumber();

我希望输出在“标签”中 16 17 18岁 19 20 但没有输出

2 个答案:

答案 0 :(得分:2)

 var ports_dic = [16, 17, 18, 19, 20];
    
    function loop_ports(){   
    
    	for (var i = 0; i < ports_dic.length; i++){
    	var node = document.createElement("LI");                 // Create a <li> node
var textnode = document.createTextNode(ports_dic[i]);         // Create a text node
node.appendChild(textnode);                              // Append the text to <li>
document.getElementById("onu_tags").appendChild(node);     // Append <li> to <ul> with id="myList"

    	};
    }
    <body onload="loop_ports()">
      <ul id="onu_tags" class="tags">
           
      </ul>
    </body>

您忘记了将字典项变成文本节点(也不需要console.log位)。

答案 1 :(得分:0)

ports_dic不是字典,并且您不是在创建span_element,而是将“ console.log()”分配给变量span_element。发布前请仔细检查

ParserError: Error tokenizing data. C error: Expected 1 fields in line 12, saw 2

<script>
var ports_dic = {"1/1/12":[16, 17, 18, 19, 20]};

function loop_ports(){   
  var n_list = document.value = ports_dic["1/1/12"] 
  for (var i = 0; i < n_list.length; i++){
        var span = document.createElement("SPAN");
        span_element = console.log(n_list[i]);
        span.appendChild(span_element);
        document.getElementById("onu_tags").appendChild(span);
    };
}
</script>
<body onload="loop_ports()">
  <div id="onu_tags" class="tags">

  </div>
</body>
    var ports_dic = {"1/1/12":[16, 17, 18, 19, 20]};
    
    function loop_ports(){   
      var n_list = document.value = ports_dic["1/1/12"] 
      for (var i = 0; i < n_list.length; i++){
    		var span = document.createElement("SPAN");
    		var span_element = document.createTextNode(n_list[i]);
    		span.appendChild(span_element);
    		document.getElementById("onu_tags").appendChild(span);
    	};
    }