JavaScript的新手,我认为我需要一个循环.....

时间:2015-11-12 15:14:45

标签: javascript arrays loops for-loop innerhtml

我有一个180个字符的数字字符串,需要分成6组,分成2个字符数字,然后按升序排序。

我已经做到了这一点,但它看起来很脏,而且我非常肯定我逐渐提高了对JavaScript的理解,一个简洁的小循环会为我节省大量的重复。

    <script type="text/javascript">

var ticketString =   "011722475204365360702637497481233455758302154058881928446789061241507324334876840738576186051132437816395663800818206590104559628214294664710935667287132130687703253151692742547985".match(/.{1,2}/g);

var groupa = ticketString.slice (0,15);

groupa.sort();

var groupb = ticketString.slice (15,30);

groupb.sort();

var groupc = ticketString.slice (30,45);

groupc.sort();

var groupd = ticketString.slice(45,60);

groupd.sort();

var groupe = ticketString.slice(60,75);

groupe.sort();

var groupf = ticketString.slice(75,90);

groupf.sort();

function displayArray () {

document.getElementById('ticketOne').innerHTML = groupa;

document.getElementById('ticketTwo').innerHTML = groupb;

document.getElementById('ticketThree').innerHTML = groupc;

document.getElementById('ticketFour').innerHTML = groupd;

document.getElementById('ticketFive').innerHTML = groupe;

document.getElementById('ticketSix').innerHTML = groupf;

}

现在将输出放入段落中,但我知道这可以比我拥有的方式更容易。函数displayArray加载了body标签。

6 个答案:

答案 0 :(得分:4)

如果您可以将元素从ticketOneticketTwo等重命名为ticket1ticket2等:

<script type="text/javascript">

 var ticketString = "011722475204365360702637497481233455758302154058881928446789061241507324334876840738576186051132437816395663800818206590104559628214294664710935667287132130687703253151692742547985".match(/.{1,2}/g);
 for (var i=0; i<ticketString.length/15; i++) {
     var group = ticketString.slice(i*15, i*15+15);
     group.sort();
     document.getElementById('ticket'+(i+1)).innerHTML = group;
 }
 </script>

答案 1 :(得分:1)

所以我认为这是最好的解决方案:

var ticketString =   "011722475204365360702637497481233455758302154058881928446789061241507324334876840738576186051132437816395663800818206590104559628214294664710935667287132130687703253151692742547985".match(/.{1,2}/g);

var group = [];
for (var i = 0; i < 180 / 15 / 2; i++) {
    group[i] = ticketString.slice(i * 15, (i + 1) * 15);
    group[i].sort();

    document.getElementById('ticket[' + i + ']').innerHTML = group[i];
}

我在这里做的是我创建了一个名为group的本地数组,这个数组在循环中比使用&#34; group1&#34;这样的名称更容易处理。或者&#34; ticketFirst&#34;。

之后我几乎和你做的一样,但是因为我使用了for循环,所以我能够显着缩短它。

我使用i&lt; 180/15/2是因为你在2个字符包中将它们配对。

for (var i = 0; i < 180 / 15 / 2; i++)
你必须有这样的HTML:

<body>
    <p id="ticket[0]"></p>
    <p id="ticket[1]"></p>
    <p id="ticket[2]"></p>
    <p id="ticket[3]"></p>
    <p id="ticket[4]"></p>
    <p id="ticket[5]"></p>
</body>

答案 2 :(得分:0)

您可以将其缩小为:

var groupArray = [];
    for(var i=0;i<100;i+=15){
    groupArray.push(ticketString.slice (i,15+i));
        groupArray[groupArray.length-1].sort();
    }

答案 3 :(得分:0)

你可以做这样的事情,如果你改变了你的机票&#39; id是一张通用的机票&#39;类;

&#13;
&#13;
var ticketString =   "011722475204365360702637497481233455758302154058881928446789061241507324334876840738576186051132437816395663800818206590104559628214294664710935667287132130687703253151692742547985".match(/.{1,2}/g);
var tickElem = document.querySelectorAll('.ticket');
var strPoint = 0;
for(var i in tickElem)
{
  var grp = ticketString.slice(strPoint, (strPoint += 15));
  grp.sort();
  tickElem[i].innerText = grp.join('');
}
&#13;
&#13;
&#13;

答案 4 :(得分:0)

compact 版本如何:

var start = 0;
['ticketOne', 'ticketTwo', 'ticketThree', 'ticketFour', 'ticketFive', 'ticketSix']
.forEach(function (id) {   
    document.getElementById(id).innerHTML = ticketString.slice(start, start += 15).sort();
});

答案 5 :(得分:0)

 <script>

 var ticketString ="011722475204365360702637497481233455758302154058881928446789061241507324334876840738576186051132437816395663800818206590104559628214294664710935667287132130687703253151692742547985".match(/.{1,2}/g);

 function loadTickets () {

 var ticket = [];

 for (var i = 0; i < ticketString.length / 15; i++) {

 ticket[i] = ticketString.slice(i * 15, (i + 1) * 15).sort();

 var tableCre = document.createElement("TABLE");

 tableCre.setAttribute("id","ticketTable" + i)

 document.body.appendChild(tableCre);

 document.getElementById('ticketTable' + i).innerHTML = ticket[i];

 }

 console.log(ticketString);

 console.log(ticket);

 };

</script>

修好了,@ Quikers - 给你竖起大拇指;因为这是我的想法 - 将.sort()函数带入ticket [i]变量以稍微修剪它,并根据数组的数量,我动态创建了6个表,其中包含字符串。我必须开发表并设置它们,但我现在几乎就在那里。感谢你的帮助。