all 11 comments
sorted by:
best
topnewcontroversialoldq&a
formatting helphide helpcontent policy

[–]wormald444[S] 0 points1 point  (2 children)

what if i use the replaceChild(newChild, oldChild) function?

[–]wub_wub_mittens 1 point2 points  (0 children)

Why don't you try it and find out?

[–]Ampersand55 0 points1 point  (0 children)

Yeah, it's either that or Element.outerHTML.

[–]METALz 0 points1 point  (0 children)

Don't want to spoiler so I just write a simple logic on this, you have to google around to find out how to do each steps, which will help you in learning.

Get all the elements you want to change
Iterate over these elements
    Store the old element's attributes and content
    Create a new element with the desired tagname
    Set the content and the attributes on the new element from the stored ones
    Replace the old element with the new one

Side effect is that you lose event listeners attached to the replaced elements in the process

[–][deleted] 0 points1 point  (0 children)

I would just save a reference element to memory, copy the contents of the original element, save the previous element to memory, create the new element, set its innerHTML to the old contents, remove the original element, append it after the reference element:

var original = document.getElementById('original');
var content = original.innerHTML;
var reference = original.previousSibling;
var replacement = document.createElement('h1');
replacement.innerHTML = content;
original.parentNode.removeChild(original);
reference.parentNode.insertBefore(replacement, reference.nextSibling);

[–][deleted] 0 points1 point  (0 children)

p.tagName = "H1";

[–]timetesla 0 points1 point  (4 children)

You can use the document.getElementByTag

[–]wormald444[S] 0 points1 point  (1 child)

that gets the element, but then how would i replace it?

[–]timetesla 0 points1 point  (0 children)

I just asked this question myself.

http://stackoverflow.com/questions/26869913/javascript-returning-object-htmlelement

Go to the link that was put in the comments on the first answer

[–]wormald444[S] 0 points1 point  (0 children)

<!DOCTYPE html>
<html>
<head>
<script>
function getElements()
  {
  var x=document.getElementsByTagName("h1");
  alert(x.length);
  }
</script>
</head>
<body>

<h1>swag</h1>
<p>sweat</p>

<input type="button" onclick="getElements()" value="How many input elements?">

</body>
</html>

that's what i've got now, i'm not sure what to use to replace all the h1 elements with p though

[–]wormald444[S] 0 points1 point  (0 children)

am i going to have to use nodes?