Question

我正在研究一个简单的GreaseMonkey脚本。我没有权限使用jQuery。

我需要替换此HTML：

<img border="0" title="NEW_UNI_LOGO.png" src="/OA_MEDIA/NEW_UNI_LOGO.png"></img>

使用此HTML：

<h1>Production</h1>

我试过了：

var cells = document.querySelectorAll('body');
for (var i = 0; i < cells.length; i++) {
        john = cells[i].innerHTML;
        john = john.replace('<img border="0" title="NEW_UNI_LOGO.png" src="/OA_MEDIA/NEW_UNI_LOGO.png"></img>', '<h1>Production</h1>');
        cells[i].innerHTML = john;
}

但不幸的是它不起作用。

img标记的HTML放在表格中。我尝试替换的HTML代码段只在页面上显示一次。

由于

Answer 1

尝试：

var img = document.querySelector("img[title='NEW_UNI_LOGO.png']");
var h1 = document.createElement('h1');
h1.appendChild(document.createTextNode("Production");
img.parentNode.replaceChild(h1,img);

这将寻找特定的图像元素（使用标题作为标识符 - 根据需要进行调整），并将其替换为新创建的H1元素。

Answer 2

试试这个：

var imgs=document.getElementsByTagName('img');
for(var i=imgs.length-1;i>=0;i--){
    if(imgs[i].title == 'NEW_UNI_LOGO.png') {
      var h1 = document.createElement('h1');
      h1.innerHTML = 'Production';
      imgs[i].parentNode.insertBefore( h1, imgs[i] );
      imgs[i].parentNode.removeChild(imgs[i]);  
    }
}

以下代码正常运行：http://jsfiddle.net/4UHHL/

或，您可以像这样检查图片文件名：

var img_file_name = 'NEW_UNI_LOGO.png'
var imgs=document.getElementsByTagName('img');
for(var i=imgs.length-1;i>=0;i--){
    if(imgs[i].src.toLowerCase().indexOf('/'+img_file_name.toLowerCase())!=-1) {
      var h1 = document.createElement('h1');
      h1.innerHTML = 'Production';
      imgs[i].parentNode.insertBefore( h1, imgs[i] );
      imgs[i].parentNode.removeChild(imgs[i]);  
    }
}

以下是第二部分的代码：http://jsfiddle.net/Wh2q3/

用H1标签替换img标签

2 个答案: