如何从BackdraftJS元素中获取innerHTML？

你用e.div()创建的foo并不是原生HTMLElement节点，而是某个DOM封装库返回的实例/虚拟DOM对象，所以直接访问innerHTML或bdDom.root无效。需要先拿到它对应的原生DOM节点，再获取innerHTML。

可以按以下几种方式尝试：

1. 查找封装对象暴露的原生节点属性 #

这类库通常会把原生DOM元素挂载在实例的el、element或node属性上，试试：

foo.el.innerHTML;
// 或者
foo.element.innerHTML;
// 或者
foo.node.innerHTML;

2. 检查bdDom的其他子属性 #

你已经试过foo.bdDom.root，可以看看bdDom下有没有element、dom这类属性：

foo.bdDom.element.innerHTML;
// 或者
foo.bdDom.dom.innerHTML;

3. 虚拟DOM类库的处理方式 #

如果e.div返回的是虚拟DOM节点（类似mithril、preact的语法），需要先把它渲染到真实DOM容器中再获取：

// 创建临时容器
const tempContainer = document.createElement('div');
// 用对应库的渲染方法把foo渲染进去（替换成你使用的库的渲染函数）
render(tempContainer, foo);
// 此时就能拿到目标内容
console.log(tempContainer.innerHTML);

4. 手动查找原生节点 #

如果上面的方法都不行，打开浏览器控制台执行console.dir(foo)，展开对象的所有属性，找到类型为HTMLElement的节点，再访问它的innerHTML即可。

内容的提问来源于stack exchange，提问作者Peter Hollingsworth