Chrome内容脚本无法检索Web元素的自定义属性。

6 浏览
0 Comments

Chrome内容脚本无法检索Web元素的自定义属性。

我执行了以下代码

document.getElementsByTagName('img')[0]['!abc'] = "abc";

来为一个图像元素设置"!abc"属性。

当我尝试在内容脚本中获取这个属性时,结果为null。

但是当我试图在文档控制台中获取它时,结果为"abc"。

0
0 Comments

问题出现的原因是Chrome content script无法检索到网页元素的自定义属性。这可能是因为content script运行在一个独立的环境中,无法直接访问网页的DOM结构。

解决方法是通过将DOM元素转换为真正的数组来获取自定义属性。可以定义一个函数来实现这个转换过程。首先使用document.getElementsByTagName(tagname)获取到元素集合,然后通过Array.prototype.slice.call(elements)将其转换为真正的数组。这样就可以使用数组的方法来操作元素了。

下面是完整的解决方案代码:

function setElementAttribute(tagname, index, attrName, value) {
    var elements = document.getElementsByTagName(tagname); // 返回一种类似数组的对象
    elements = Array.prototype.slice.call(elements); // 将其转换为真正的数组
    elements[index].setAttribute(attrName, value);
}

使用这个函数,你可以通过指定标签名、索引、属性名和属性值来设置元素的自定义属性。

0
0 Comments

问题出现的原因是在Chrome的content script中无法正确获取网页元素的自定义属性。解决方法是使用setAttribute()方法来设置自定义属性,然后通过getAttribute()方法来获取属性值。

具体解决方法如下:

var myImg = document.getElementsByTagName('img')[0];
myImg.setAttribute("attrib_name", value);

另外,如果想要获取自定义属性的值,可以使用getAttribute()方法,如下所示:

var attribValue = document.getElementsByTagName('img')[0].getAttribute("attrib_name");

这样就能够正确获取到自定义属性的值了。

0