Javascript indexOf and replace - am I missing something

Question

I have this javascript function; i send it a number from a button and all go well untill the index-of method it has a problem.

CODE:

   <script lang="ja" type="text/javascript">


    function YellowChair(NumId)
    {
        if (document.getElementById("CheckBox" + NumId).checked)
        {
            document.getElementById("ChairImg" + NumId).src = "Images/YellowChair.png";
            TypeTheNum(NumId, true);
        }
        else
        {
            document.getElementById("ChairImg" + NumId).src = "Images/BlueChair.png";
            TypeTheNum(NumId, false);
        }

    }
    function TypeTheNum(NumId,Add)
    {
        var Label = document.getElementById("SelectedSitsLabel");
        var Hidden = document.getElementById("SelectedSitsHidden");


        if (Label.innerHTML == "")
        {
            Label.textContent += NumId;
            Hidden.textContent += NumId;
        }
        else
        {
            if (Add)
            {
                Label.textContent += "," + NumId;
            }
            else
            {
         // getting stuck here.
                if (Label.indexOf((NumId + ",").toString()) != -1)
                {
                    alert("1");
                    Label.replace((NumId + ",").toString(), "");
                }
                else
                {
                    alert("ELSE");
                    Label.replace(("," + NumId).toString(), "");
                }
            }
        }
        Hidden.textContent = Label.textContent;
    }


</script>

i thought maybe its because I insert text with textContent, also , im pretty sure somthing is wrong with the replace .

Many thanks!

Answer 1

The function:

var element = document.getElementById(id);

Returns an Element object, or null but not an string.

Maybe you want to change your code to use textContent property which seems to be the one you are working on like:

if (Label.textContent.indexOf((NumId + ",").toString()) != -1){
   alert("1");
   Label.textContent.replace((NumId + ",").toString(), "");
}
else{
   alert("ELSE");
   Label.textContent.replace(("," + NumId).toString(), "");
}

Answer 2

Label is a DOM element, not a string. So if you need to get characters from the text inside the element, you have to use something like var content = Label.textContent; content.indexOf() var content = Label.textContent; content.indexOf() and then replace the textContent again after replacing it in the string.

Also as a sidenote, try to look up the differences between innerHTML, textContent and innerText so you can avoid future issues.

Answer 3

HTMLElement hasn't a method indexOf. String owned the method.remeber reset textContent if the textContent changed.

  function YellowChair(NumId) { if (document.getElementById("CheckBox" + NumId).checked) { document.getElementById("ChairImg" + NumId).src = "Images/YellowChair.png"; TypeTheNum(NumId, true); } else { document.getElementById("ChairImg" + NumId).src = "Images/BlueChair.png"; TypeTheNum(NumId, false); } } function TypeTheNum(NumId,Add) { var Label = document.getElementById("SelectedSitsLabel"); var Hidden = document.getElementById("SelectedSitsHidden"); if (Label.innerHTML == "") { Label.textContent += NumId; Hidden.textContent += NumId; } else { if (Add) { Label.textContent += "," + NumId; } else { // getting stuck here. if (Label.textContent.indexOf((NumId + ",").toString()) != -1) { alert("1"); Label.textContent=Label.textContent.replace((NumId + ",").toString(), ""); } else { alert("ELSE"); Label.textContent=Label.textContent.replace(("," + NumId).toString(), ""); } } } Hidden.textContent = Label.textContent; } 

 <button onclick="TypeTheNum('foo')">Remove `foo`</button> <div id="SelectedSitsLabel">foo,bar,baz</div> <div id="SelectedSitsHidden"></div> 

Answer 4

您需要将替换项分配给以下内容：

Label.textContent = Label.textContent.replace(…)