我想创建一个将HTML元素复制为对象的程序,以便以后在不更改实际DOM的情况下进行操作。
我正在创建一个简单的多功能函数,该函数将字符串作为输入,然后通过document.body
查找该文本的父标记。我利用DOM解析器来执行此操作,但是很快发现我无法使用Object.create
复制HTML节点。
下面是产生问题的代码:
[...(Object.create(document.body).childNodes)]
我希望结果是document.body
的所有子节点的可编辑副本,但是却出现此错误:
TypeError: Illegal invocation
at Object.module.exports (bundle.js:6)
at Object.1.../Util/parsers (bundle.js:10)
at o (bundle.js:1)
at r (bundle.js:1)
at bundle.js:1
注意: 我正在使用browserify来捆绑我的代码。
以下是我所有的(未完成的)代码:
主脚本:
require('../Util/parsers')
module.exports = function(searchString, opts = {}) {
const options = Object.assign({start: document.body, textOnly: true, parentLevel: 1, excludeTags: []}, opts)
console.log([...(Object.create(options.start).childNodes)].mapFlat('childNodes', i => i instanceof NodeList ? [...i] : i))
}
try{
module.exports()
} catch(e) {
console.log(e)
}
实用程序/解析器:
Array.prototype.mapFlat = function(property, failed = i => i) {
function runMap(retval, property, failed = i => i) {
retval = retval.map(i => {
if(i[property]) {
const retval = [i, i[property]].flat(Infinity)
delete i[property]
return retval
}
return failed(i)
}).flat(Infinity)
return retval
}
let retval = this
retval = runMap(retval, property, failed)
while(retval.filter(i => i[property])[0]) {
retval = runMap(retval, property, failed)
}
return retval
}