如何在javascript中改变DOM的innerHTML

How to change the innerHTML of the DOM in javascript

本文关键字：DOM innerHTML 改变 javascript      更新时间：2023-09-26

嗨，我在js中有两个函数，它正在替换DOM的属性，有"从业者"或"患者"，但它正在进入循环和条件，但没有被改变。

function ReplaceInnerHtml(el, type, replaceTo) {
  if (el != "" && el != null) {
    if (type == "Practitioner") {
      el.innerHTML.replace("Practitioner", replaceTo);
    } else if (type == "Patient") {
      el.innerHTML.replace("Patient", replaceTo);
    }
  }
}
function SetAllDivLabelCaption(OABPreferences) {
  var listlabel = document.getElementsByTagName("label");
  var listspan = document.getElementsByTagName("span");
  var listdiv = document.getElementsByTagName("div");
  for (var i = 0; i < listlabel.length; i++) {
    if (listlabel[i].innerHTML.indexOf("Practitioner") > -1) {
      ReplaceInnerHtml(document.getElementById(listlabel[i].id), "Practitioner", OABPreferences.OABRenamePractitioner);
    } else if (listlabel[i].innerHTML.indexOf("Patient") > -1) {
      ReplaceInnerHtml(document.getElementById(listlabel[i].id), "Patient", OABPreferences.OABRenamePatient);
    }
  }
  for (var i = 0; i < listspan.length; i++) {
    if (listspan[i].innerHTML.indexOf("Practitioner") > -1) {
      ReplaceInnerHtml(document.getElementById(listspan[i].id), "Practitioner", OABPreferences.OABRenamePractitioner);
    } else if (listspan[i].innerHTML.indexOf("Patient") > -1) {
      ReplaceInnerHtml(document.getElementById(listspan[i].id), "Patient", OABPreferences.OABRenamePatient);
    }
  }
  for (var i = 0; i < listdiv.length; i++) {
    if (listdiv[i].innerHTML.indexOf("Practitioner") > -1) {
      ReplaceInnerHtml(document.getElementById(listdiv[i].id), "Practitioner", OABPreferences.OABRenamePractitioner);
    } else if (listdiv[i].innerHTML.indexOf("Patient") > -1) {
      ReplaceInnerHtml(document.getElementById(listdiv[i].id), "Patient", OABPreferences.OABRenamePatient);
    }
  }
}


function ReplaceInnerHtml(el, type, replaceTo) {
                if (el != "" && el != null) {
                    if (type == "Practitioner") {
                        el.innerHTML=el.innerHTML.replace("Practitioner", replaceTo);
                    }
                    else if (type == "Patient") {
                       el.innerHTML= el.innerHTML.replace("Patient", replaceTo);
                    }
                }
            }
            function SetAllDivLabelCaption() {
                var listlabel = document.getElementsByTagName("label");
                var listspan = document.getElementsByTagName("span");
                var listdiv = document.getElementsByTagName("div");
                for (var i = 0; i < listlabel.length; i++) {
                    if (listlabel[i].innerHTML.indexOf("Practitioner") > -1) {
                        ReplaceInnerHtml(document.getElementById(listlabel[i].id), "Practitioner", "ROB");
                    }
                    else if (listlabel[i].innerHTML.indexOf("Patient") > -1) {
                        ReplaceInnerHtml(document.getElementById(listlabel[i].id), "Patient", "BOB");
                    }
                }
                for (var i = 0; i < listspan.length; i++) {
                    if (listspan[i].innerHTML.indexOf("Practitioner") > -1) {
                        ReplaceInnerHtml(document.getElementById(listspan[i].id), "Practitioner", "ROB");
                    }
                    else if (listspan[i].innerHTML.indexOf("Patient") > -1) {
                        ReplaceInnerHtml(document.getElementById(listspan[i].id), "Patient", "BOB");
                    }
                }
                for (var i = 0; i < listdiv.length; i++) {
                    if (listdiv[i].innerHTML.indexOf("Practitioner") > -1) {
                        ReplaceInnerHtml(document.getElementById(listdiv[i].id), "Practitioner", "ROB");
                    }
                    else if (listdiv[i].innerHTML.indexOf("Patient") > -1) {
                        ReplaceInnerHtml(document.getElementById(listdiv[i].id), "Patient", "BOB");
                    }
                }
            }
<h1 id="title">Javascript example no.2</h1>
<label id="lbl1">Label-Practitioner</label><br/>
<label id="lbl2">Label-Again Prac Pat</label><br/>
<label id="lbl3">Label-Patient</label><br/>
<span id="spn1">Span-Practitioner</span><br/>
<span id="spn2">Span-Again Practitioner</span><br/>
<span id="spn3">Span-No Prac</span><br/>
<div id="dv1">Div-Practitioner</div><br/>
<div id="dv2">Div-Again Practitioner</div><br/>
<div id="dv3">Div-No Prac</div><br/>
<button onclick="SetAllDivLabelCaption();">
Replace
</button>

在@RobG评论的基础上，我添加了问题的答案，因为它在添加el.innerHTML=el.innerHTML.replace("Practitioner", replaceTo);后工作谢谢你的帮助。由于@RobG

相关文章：