Javascript 如何将任何类型的元素替换为具有相等装箱的div？

我正在尝试删除一个DOM元素，我将把它放在其他地方，我需要兄弟元素的位置不改变

我试过这种方法的一些变体

var elem = $("#theElement");
var ghost = $('<div></div>');
ghost.css({
   width: elem.outerWidth(true),
   height: elem.outerHeight(true),
   margin: 0
});
         
elem.replaceWith(ghost);

但该文件略有崩溃

我知道我只能更改元素的可见性，但不能更改所需的可见性。我将把它放在DOM中的其他地方，并且不能复制

问题 如何用占用相同空间的div替换任何类型的元素

编辑

---

请记住，我不能更改源元素属性

我事先不知道它有哪些物品和属性，只是把它从原来的地方拿出来，移到别处

jQuery文档说明：

.outerHeighttrue：如果includeMargin参数设置为true，则也包括页边距顶部和底部

.outerWidthtrue：如果includeMargin被省略或为false，则填充和边框将包含在计算中；如果为真，则还包括边距

---

这是因为浏览器提供了空白，在dev工具中称为用户代理样式表

我已经修改了您的plunk，使其具有如下css

h1 {
  color: red;
  margin:0px !important;  
}

这个问题似乎已经解决了

编辑：

我已将您的代码编辑为如下内容：

$(function(){
  var elem = $("h1");
  var ghost = $('<div></div>');
       ghost.css({
         width: elem.outerWidth(),
         height: elem.outerHeight(),
         margin: 21
       });

---

outerWidthtrue和OuterWightTrue表示：如果为true，则边距也包括在内。抱歉，但“附加说明”中也提到了一些内容。当用户缩放页面时，尺寸可能不正确。情况并非如此。您的plunker似乎不适用于我。。。我正在获取默认页面。请记住，我无法更改源元素属性。这是因为您需要将“h1”元素复制到其他地方吗？为什么在修改此“h1”以隐藏它之前不能复制它？是的。我事先不知道它有哪些项目和哪些属性，只是把它从原来的位置拿出来，移到别处。对不起，没有保证金的div怎么样？我需要一个通用的解决方案。我想说的是，从DOM中获取它，不管div上的最终值是0还是非0，都可以得到，把它放在一个变量中，并传递给你的css

http://www.iecss.com
http://mxr.mozilla.org/mozilla-central/source/layout/style/html.css
http://trac.webkit.org/browser/trunk/Source/WebCore/css/html.css