Normkonformer Code für den Ersatz von Dokumenten.All

Question

Wir haben alten Code, der dynamisch HTML-Formulardaten aus einer Datenbank erstellt, und es wurde geschrieben, dass verweist auf document.all, um ein Array von nicht eindeutigen ID'd-Kontrollkästchen abzurufen. Ich muss die "Methode der wenigsten Änderungen" finden, damit der Code auf standardkonforme Weise funktioniert. Meine Frage besteht darin, sowohl die document.myForm als auch die document.all Anrufe durch etwas zu ersetzen, das das gleiche erzeugt, aber standardkonform ist.

<form name="myForm"> 
.... 
    <input name="2630" id="ck_2630" onclick="click(document.myForm.ck_2630[0]);" type="checkbox" value="139"><span onclick="document.myForm.ck_2630[0].checked = !document.myForm.ck_2630[0].checked;click(document.myForm.ck_2630[0]);">Ankle, Left</span><br/> 
    <input name="2630" id="ck_2630" onclick="click(document.myForm.ck_2630[1]);" type="checkbox" value="140"><span onclick="document.myForm.ck_2630[1].checked = !document.myForm.ck_2630[1].checked;click(document.myForm.ck_2630[1]);">Ankle, Right</span><br/> 
    <input name="2630" id="ck_2630" onclick="click(document.myForm.ck_2630[2]);" type="checkbox" value="141"><span onclick="document.myForm.ck_2630[2].checked = !document.myForm.ck_2630[2].checked;click(document.myForm.ck_2630[2]);">Arm, Left</span><br/> 
    <input name="2630" id="ck_2630" onclick="click(document.myForm.ck_2630[3]);" type="checkbox" value="142"><span onclick="document.myForm.ck_2630[3].checked = !document.myForm.ck_2630[3].checked;click(document.myForm.ck_2630[3]);">Arm, Right</span><br/> 
... 
</form> 

<script> 
.... 
function getElem_Opener(strElementName) { 
    return document.all(strElementName); 
} 
.... 
</script> 

Der Code funktioniert in allen Versionen von IE, mit Ausnahme von IE 11 in Edge-Modus, da der Code document.all('ck_2630') verwendet das Array zu holen. Edge beseitigt document.all (die Anweisung if (document.all) gibt false zurück), aber ich weiß nicht, ob es auch das document.<form name>.<element name/id> Konstrukt beseitigt, das seine Felder auf dieselbe Weise zu behandeln scheint wie document.all.

<form name="myForm" method="post"> 
    <button onclick="checkElement('139'); return false;">Select Left Ankle</button><br/> 
    <button onclick="checkElement('140'); return false;">Select Right Ankle</button><br/> 
    <button onclick="checkElement('141'); return false;">Select Left Arm</button><br/> 
    <button onclick="checkElement('142'); return false;">Select Right Arm</button><br/> 

    <table name="tbl2630"> 
    <tr id="rw_2630_139" style="display:none"><td> 
     <input name="2630" id="ck_2630" onclick="click(document.myForm.ck_2630[0]);" type="checkbox" value="139"><span onclick="document.myForm.ck_2630[0].checked = !document.myForm.ck_2630[0].checked;click(document.myForm.ck_2630[0]);">Ankle, Left</span> 
    </td></tr> 
    <tr id="rw_2630_140" style="display:none"><td> 
     <input name="2630" id="ck_2630" onclick="click(document.myForm.ck_2630[1]);" type="checkbox" value="140"><span onclick="document.myForm.ck_2630[1].checked = !document.myForm.ck_2630[1].checked;click(document.myForm.ck_2630[1]);">Ankle, Right</span> 
     </td></tr> 
    <tr id="rw_2630_141" style="display:none"><td> 
     <input name="2630" id="ck_2630" onclick="click(document.myForm.ck_2630[2]);" type="checkbox" value="141"><span onclick="document.myForm.ck_2630[2].checked = !document.myForm.ck_2630[2].checked;click(document.myForm.ck_2630[2]);">Arm, Left</span> 
    </td></tr> 
    <tr id="rw_2630_142" style="display:none"><td> 
     <input name="2630" id="ck_2630" onclick="click(document.myForm.ck_2630[3]);" type="checkbox" value="142"><span onclick="document.myForm.ck_2630[3].checked = !document.myForm.ck_2630[3].checked;click(document.myForm.ck_2630[3]);">Arm, Right</span> 
    </td></tr> 
    </table> 

    <script> 
function click(ck) { 
    alert("selected item " + ck.name + ", value " + ck.value); 
} 

function getElem_Opener(strElementName) { 
    return document.all(strElementName); 
} 

function checkElement(intAltID){ 
    var boolValid = false, boolIsCheckbox = false; 
    var strItemID = "2630"; 
    var elem = getElem_Opener('ck_' + strItemID); 
    var elemRow = null, elemUncheck = null, elemTable; 

    boolIsCheckbox = true; 

    if (elem.length) {     
    for (var i = 0; i < elem.length; i++) { 
     if (elem[i].value == intAltID) { 
     elem[i].checked = true; 
     boolValid = true; 
     elemRow = getElem_Opener('rw_' + strItemID + '_' + intAltID); 
     break;      
     } 
     } 
    } 

    if (boolValid) { 
    if (elemRow != null) { 
     elemRow.style.display = 'inline';     
    }  
    }  
}</script> 
</form> 

Answer 1

In all meinen Recherchen habe ich, dass der beste Ersatz ist document.getElementById für document.all gefunden, es sei denn, das Ergebnis mehrere Treffer zurückkehren wird erwartet, und dann müssen Sie für den Name-Attribut verwenden, und document.getElementsByName zu verwenden. Das ist die Lösung, die wir benutzt haben, und bisher hat es prächtig funktioniert. An Orten, wo document.<formName> Probleme auftreten, haben wir die gleiche Lösung verwendet.