如何在随机排序列表中随机化多个无序列表?

时间:2015-02-17 21:49:23

标签: javascript html list random

我试图用包含随机答案的随机问题(随机化有序列表)进行测试(随机化无序列表)。我可以让有序列表随机化,但我只能得到一个无序列表来随机化。该代码仅随机化它找到的第一个无序列表。我想随机化所有无序列表。任何帮助表示赞赏。

<ol>
<li>What are the three main areas of the Standard User Interface?
  <ul type="none">
    <li><input type="radio" name="q1" value="0" />A. Header, Banner, Frame, Application Window</li>
    <li><input type="radio" name="q1" value="0" />B. Content Frame, Homepage, Form </li>
    <li><input type="radio" name="q1" value="1" />C. Application Navigator, Banner Frame, Content Frame </li>
    <li><input type="radio" name="q1" value="0" />D. None of the above</li>
  </ul>
</li>

<li>In the User interface, what is the gray toolbar called which allows you to add bookmarks?<br/>

  <ul type="none">
    <li><input type="radio" name="g2" value="0" />A. Gauge</li><br />
    <li><input type="radio" name="g2" value="1" />B. Edge</li><br />
    <li><input type="radio" name="g2" value="0" />C. Remedy</li><br />
    <li><input type="radio" name="g2" value="0" />D. Banner</li><br />
  </ul><br/>
</li>

<li>What can be captured in an update set?<br/>

  <ul type="none">
    <li><input type="radio" name="g3" value="0" />A. Modified CI Rules</li><br />
    <li><input type="radio" name="g3" value="1" />B. Business Rules</li><br />
    <li><input type="radio" name="g3" value="0" />C. Scheduled Jobs</li><br />
    <li><input type="radio" name="g3" value="0" />D. None of the above</li><br />
  </ul>
</li>

<li>What should you always do before you commit an update set?<br/>

  <ul type="none">
    <li><input type="radio" name="g4" value="1" />A. Preview</li><br />
    <li><input type="radio" name="g4" value="0" />B. Merge</li><br />
    <li><input type="radio" name="g4" value="0" />C. Ignore</li><br />
    <li><input type="radio" name="g4" value="0" />D. All of the above</li><br />
  </ul>
</li>

<li>Which of the following is a Business Rule best pratice?<br/>

  <ul type="none">
    <li><input type="radio" name="g5" value="1" />A. Make business rules small and specific</li><br />
    <li><input type="radio" name="g5" value="0" />B. Use of conditions is not necessary</li><br />
    <li><input type="radio" name="g5" value="0" />C. Global business rules should be used</li><br />
    <li><input type="radio" name="g5" value="0" />D. None of the above</li><br />
  </ul>
</li>

<li>Which of the following is a Client Script best practice?<br/>

  <ul type="none">
    <li><input type="radio" name="g6" value="0" />A. Use hard coded data</li><br />
    <li><input type="radio" name="g6" value="0" />B. Maximize server lookup</li><br />
    <li><input type="radio" name="g6" value="1" />C. Do not use g_form.getReference()</li><br />
    <li><input type="radio" name="g6" value="0" />D. All of the above</li><br />
  </ul>
 </li>

 <li>Which of the following are debugging features?<br/>


  <ul type="none">
    <li><input type="radio" name="g7" value="0"/>A. Debug Business Rule</li><br />
    <li><input type="radio" name="g7" value="0"/>B. Javascript</li><br />
    <li><input type="radio" name="g7" value="1"/>C. A and B</li><br />
    <li><input type="radio" name="g7" value="0"/>D. None of the above</li><br />
  </ul>
</li>


</ol>

这是我的随机代码:

var ol = document.querySelector('ol');
temp = ol.cloneNode(true); 

for (var i = temp.children.length; i--; ){
    temp.appendChild( temp.children[Math.random() * i |0] );

    ul.parentNode.replaceChild(temp, ol); 
}

var ul = document.querySelector('ul');
temp = ul.cloneNode(true); 

for (var i = temp.children.length + 1; i--; ){
 temp.appendChild( temp.children[Math.random() * I |0] );

    ul.parentNode.replaceChild(temp, ul); 
}

1 个答案:

答案 0 :(得分:1)

document.querySelector()适用于ol元素,因为只有一个元素。捕获ul使用querySelectorAll并循环遍历其值。还有一个问题是olul的父节点丢失了。 parentNode.replaceChild...语句必须在for循环之后,而不是在querySelectorAll循环之内。在 var ol = document.querySelector('ol'); temp = ol.cloneNode(true); for (var i = temp.children.length; i--;) { temp.appendChild(temp.children[Math.random() * i | 0]); } ol.parentNode.replaceChild(temp, ol); var ul = document.querySelectorAll('ul'), parent; console.log("found " + ul.length + " ul's"); for (var k = ul.length-1; k >= 0; k--) { parent = ul[k].parentNode; temp = ul[k].cloneNode(true); for (var i = temp.children.length + 1; i--;) { temp.appendChild(temp.children[Math.random() * i | 0]); } parent.replaceChild(temp, ul[k]); } 值的循环中,必须备份父节点;见setting parent node in javascript

{{1}}