我的目标：
我正在使用 Polymer 为 Flexbox 网格系统创建自定义元素、属性和属性。
[外汇属性]
为了帮助我直观地调试我的进程，我需要一些javascript。
我想用Javascript（仅）将所有<elements>，[attributes]和"properties"的文本附加到<body>中
目前，我正在使用css的::before和::after伪元素来执行此操作，但正如您可以想象的那样,,,这可能非常耗时！
到目前为止我得到的：JS小提琴
例：
如果我有这个：
<div id="div" class="ninja"></div>
我想这样做：
<div id="div" class="ninja">
<div id="div" class="ninja">
</div>
我的猜测是.attributes是我需要使用的，但我不确定如何正确使用。
<script>
var body = document.querySelector('body').attributes;
var main = document.querySelector('main').attributes;
var section = document.querySelector('section').attributes;
var div = document.querySelector('div').attributes;
</script>
[].forEach.call(document.querySelectorAll("*"),
function(el){
el.appendChild(
document.createTextNode(el.cloneNode(false).outerHTML));
});
https://jsfiddle.net/odbbybcy/