Question

使用document.getElementsByName('spanName')或jQuery('[name="spanName"]')失败（返回[]）时从Chrome扩展程序（或控制台）中调用。但是，document.getElementById('spanId')和类名的CCS选择器一样有效。

在扩展的任何干预之前，跨度已经是DOM的一部分。但是，扩展名添加了name属性，修改了style属性，并添加了类名：

原始

<div id="parentDiv">
    <span style="background-color:Yellow">Some highlighted text</span>
</div>

更新

<div id="parentDiv">
    <span id"spanId" name="spanName" class="highlighted" style="">Some highlighted text</span>
</div>

此外，在某一点上，整个parentDiv的内部HTML被替换并且跨度被转移

let spanNodeList = ...
let newInnerHTML = ...
let patterns = ...

for (let i = 0; i < spanNodeList.length; i++) {
    newInnerHTML.replace(patterns[i], spanNodeList[i].outerHTML)
}

document.getElementById('parentDiv').innerHTML = newInnerHTML

我在添加name属性之前执行此传输。这个innerHTML替换可能是我的困境的来源吗？

顺便说一句......

我用以下内容更新了范围：

let spans = document.getElementsByTagName('span') spans[Symbol.Iterator] = [][Symbol.Iterator] for (let span of spans) { if (!/yellow/i.test(span.style.CSSText) continue; span.style.CSSText = '' span.id = <uniqueSpanId> span.name = 'spanName' span.className = "highlighted' }

Answer 1

根据规范，document.getElementsByName()返回一个元素数组。您要么必须遍历结果，要么执行document.getElementsByName('spanName')[0]

https://unix.stackexchange.com/a/152301/6515

getElementsByName失败，但getElementById适用于Chrome扩展程序

1 个答案: