Question

我想从页脚容器中删除除img-element之外的所有内容：

<footer>
    <p>Some text</p>
    <img src="logo.jpg">
</footer>

在JQuery中我会这样做：

var logo = $('footer img');
$('footer').html(logo);

我如何在普通JS中做到这一点？

Answer 1

这个怎么样？

  document.getElementsByTagName("footer")[0].innerHTML =  
            document.getElementsByTagName("img")[0]

Answer 2

这是无效的，您是否将页脚的html设置为logo jQuery对象？我认为你的意思是HTML徽标。

你会这样做：

var footer = document.getElementsByTagName('footer')[0];
var logo = footer.getElementsByTagName('img')[0];

footer.innerHTML = logo.outerHTML;

Answer 3

如果您想要

，则无需重新创建原始元素

var footer = document.getElementsByTagName('footer')[0];
var img = footer.getElementsByTagName('img')[0];
footer.innerHTML = '';
footer.appendChild(img)

演示：Fiddle

Answer 4

您可以使用querySelector（）函数。它与jquery的selector函数完全相同。

var logo = document.querySelector("footer img");
var footer = document.querySelector('footer');
footer.innerHTML = "";
footer.appendChild(logo);

有关W3Schools中的querySelector的更多信息。

Answer 5

您也可以使用它：

var footer = document.querySelector("footer");
var replecedElement = document.querySelector("footer img");
footer.innerHTML = "";
footer.appendChild(replecedElement);

演示：http://jsfiddle.net/t1qwn6bt/

在普通的JS中替换innerHTML

5 个答案: