为什么这个代码不能在IE11，Chrome，Firefox中运行，但是可以在IE8中运行？

Question

我的开发人员在工作中给我一个小模板，所以我可以编辑它并制作一个工作模型。 当他创造它时，它工作得很好; 他在IE8中做到了。 当他通过电子邮件发送给我时，我在IE11 / Chrome / Firefox中打开它没有去。 任何帮助？

 <!DOCTYPE html> <html> <head> <script> function handleVisibility(box){ var visible = (box.checked) ? "block": "none"; box.parentElement.nextSibling.style.display = visible; } </script> </head> <body> <div id="divTransfer"> <input id="cbTransferRefer" type="checkbox" value="TransferRefer" onClick = "handleVisibility(this)">Transfer/Refer<br> </div> <div id="pTransferTypes" style="display:none" > Transfer Types: <select> <option value="referred">Referred</option> <option value="internalTaskForm">Escalated via Internal Task Form</option> <option value="cci">Escalated via CCI</option> <option value="pdf">Escalated via PDF Form</option> <option value="transferred">Transferred</option> </select> </div> <div id="divTemplate"> <input id="cbTemplateRefer" type="checkbox" value="TemplateRefer" onClick = "handleVisibility(this)">Template/Refer<br> </div> <div id="pTemplateTypes" style="display:none" > Template Types: <select> <option value="referred">Referred</option> <option value="internalTaskForm">Escalated via Internal Task Form</option> <option value="cci">Escalated via CCI</option> <option value="pdf">Escalated via PDF Form</option> <option value="transferred">Transferred</option> </select> </div> </body> </html> 

Answer 1

你不一定想要nextSibling ，你想要nextElementSibling 。 如果在您的父元素之后有空格，则下一个兄弟将是该空格。 因此，您可能希望删除元素及其兄弟之间的所有空格，或者调用nextElementSibling以保证您不会获得textNode。

值得注意的是，仅在IE 9及更高版本中支持getElementSibling 。 但是，如果您需要IE 8支持，您可以简单地删除空格，保留nextSibling或利用polyfill 。