document.getElementById does not appear in browser

JavaScript
1

Hello,
i am very new to javascript and i am trying to write a code that wil delete
“< p >” and other tags.
after alot of struggeling i think i got the concept, however when i want to check in the browser nothing shows.
this is my code

<!DOCTYPE html>
<html>
<body>
<p id="test"></p>
<script>

var data = "dsrufh &lt;p&gt; fhuseirh";
var data_index = data.indexOf("&lt;" + "p" + "&gt;");
if(data_index != -1) {
	data.splice(data_index, 3);
}
document.getElementById("test").innerHTML = data;

</script>
</body>
</html>

All help would be greatly appriciated, thanks in advance

2

Running this from Chrome and looking at the developer tools console says:

Uncaught TypeError: data.splice is not a function

I’m also trying to learn JS and find that, often, running from something with developer tools can help a lot.

Perhaps the issue is that data isn’t an array?

1 Like
3

thank you this was indeed the problem, i am working in fixin this now!
i shall also use the developers tools from now on!
thanks for the help and tip!

4

Could you explain a little more about what you’re trying to achieve. I understand that you want to remove the <p> tag, but it’s worth knowing what happens around that. So for instance:

  1. What happens to any content that it’s wrapped around?
  2. What do you want to happen to the closing </p> tag? It’s worth noting that var data doesn’t contain one at the moment, but that the browser (Chrome anyway) ‘sees’ that, and closes the tag off for you.
  3. What happens if the <p> tag has a class, id, or other attribute in it?

You’ve probably worked out by now that data in this instance is a string, but what you could do to check, is add the following on the line immediately after you declare data…

console.log(typeof data);  // string

then check the browser console to see what it tells you. This is an easy way of establishing what you’re dealing with if you’re not sure, and is an invaluable debug technique when working with JavaScript.

Whilst not an array, a string can be treated as an array-like object - see the Character Access section on this page - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String - which may be of help with your solution, depending on the answers to the questions above.

5

Hello,

At this point i am trying to make a simple code to understand what i am doing. Eventually i will also remove the </p> tag. My end goal is to clean up an XML file wich contains alot of these tags wich are inneccery. If i am correct it shouldn’t remove the real <p></p> tags because i used ("&lt;" + "p" + "&gt;")

thank you for the tips! I am at work now so at this point i cant tell you if the page you send helped but i have a break soon.
Then i will come back to you directly

Hello again.

That site you send really helped me to find the solution, so Thank you.
it seems that this does the trick

var data = "dsrufh&lt;p&gt;fhuseirhhjsfk&lt;p&gt;fwekls";
    
    var data_new = data.replace(new RegExp('&lt;p&gt;', 'g'), '');
6

That does help us understand what you are trying to do.

MDN is a really good site for all things HTML, CSS and JavaScript. You’ll learn a lot from there.

No problem. That’s what we’re here for. :slight_smile:

7

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.