layout/html/tests/attributes/ol_li.html
author Honza Bambas <honzab@allpeers.com>
Fri, 10 Oct 2008 16:41:38 +0200
changeset 20258 097bf47abbcde2ba53c62212eca60c5cb5d9ce9d
parent 1 9b2a99adc05e53cd4010de512f50118594756650
permissions -rw-r--r--
Bug 413909 - nsCertOverrideService IDN handling is broken; tests; r=kaie

<HTML>
<BODY>
<h1>Attribute tests for OL and LI elements</h1>
<ol ID="myol">
  <li id="1st">One</li>
  <li id="2nd">Two 
    <ol>
      <li>Apples</li>
      <li>Oranges</li>
      <li>Bananas</li>
    </ol>
  </li>
  <li id="3rd">Three</li>
</ol>
<P>
Use the buttons below to change the attributes of the OL and LI elements.
</P>

<FORM>
<P>
Set OL element's <I>type</I> to
<SELECT SIZE="1" NAME="type">
<OPTION SELECTED VALUE="1">numerical</OPTION>
<OPTION VALUE="a">lower arabic</OPTION>
<OPTION VALUE="A">upper ararbic</OPTION>
<OPTION VALUE="i">lower roman</OPTION>
<OPTION VALUE="I">upper roman</OPTION>
</SELECT>
<INPUT TYPE="button" VALUE="Change Type" onClick="changeType(); return true;">
</P>
<P>
Set OL element's <I>start</I> to
<INPUT TYPE="text" MAXLENGTH="2" SIZE="2" NAME="start">
<INPUT TYPE="button" VALUE="Change Type" onClick="changeStart(); return true;">
</P>
<P>
Set the
<SELECT SIZE="1" NAME="nth">
<OPTION SELECTED VALUE="1st">1st</OPTION>
<OPTION VALUE="2nd">2nd</OPTION>
<OPTION VALUE="3rd">3rd</OPTION>
</SELECT>
LI element's <I>type</I> attribute to
<SELECT SIZE="1" NAME="type2">
<OPTION SELECTED VALUE="1">numerical</OPTION>
<OPTION VALUE="a">lower arabic</OPTION>
<OPTION VALUE="A">upper ararbic</OPTION>
<OPTION VALUE="i">lower roman</OPTION>
<OPTION VALUE="I">upper roman</OPTION>
</SELECT>
<INPUT TYPE="button" VALUE="Change Type" onClick="changeElementType(); return true;">
</P>
<P>
Set the
<SELECT SIZE="1" NAME="nth2">
<OPTION SELECTED VALUE="1st">1st</OPTION>
<OPTION VALUE="2nd">2nd</OPTION>
<OPTION VALUE="3rd">3rd</OPTION>
</SELECT>
LI element's <I>value</I> attribute to
<INPUT TYPE="text" MAXLENGTH="2" SIZE="2" NAME="start2">
<INPUT TYPE="button" VALUE="Change Type" onClick="changeElementStart(); return true;">
</P>
</P>
</FORM>
<SCRIPT>
var ol = document.getElementById("myol");
var types = new Array("1", "a", "A", "i", "I");
function changeType() {
   ol.type = types[document.forms[0].type.selectedIndex];
}

function changeStart() {
   ol.start = Number(document.forms[0].start.value);
}

// We should be able to do this with the select elements value, but
// since that doesn't work we need to maintain this array.
var nth = new Array("1st", "2nd", "3rd");
function changeElementType() {
   var li = document.getElementById(nth[document.forms[0].nth.selectedIndex]);
   li.type = types[document.forms[0].type2.selectedIndex];
}

function changeElementStart() {
   var li = document.getElementById(nth[document.forms[0].nth2.selectedIndex]);
   li.value = Number(document.forms[0].start2.value);
}
</SCRIPT>

</BODY>
</HTML>