Question

这是我的代码：

var i;
var pic = document.getElementById('image');
var picSrc = pic.src;
var fullSrc = picSrc.split('h.jpg')[0] + '.jpg';
pic.src = fullSrc;

document.getElementById('next').onmousedown = function () {
    i = 0;
            // it works up to here
    pic.addEventListener("DOMAttrModified", function(event) {
        if (i == 0 && event.attrName == "src") {
        pic = document.getElementById('image');
        i = 1;   // this is to prevent endless loop
        picSrc = pic.src;
        fullSrc = picSrc.split('h.jpg')[0] + '.jpg';
        pic.src = fullSrc;
        }
});
return true;
};

它应该适用于imgur的水平布局相册，并用全分辨率的图像替换低分辨率图像，一次替换一个图像（当前显示的图像）。单击“下一步”按钮，将显示一个新图像。但是，脚本不会加载下一个完整分辨率图像。它仅适用于第一个加载的图像。

Answer 1

你正在搞乱你的范围，在第一次运行后使整个代码无效。这也应该在控制台中弹出足够多的错误。重新分配到正确位置的任务：

document.getElementById('next').onmousedown = function () {
    var i;
    var pic = document.getElementById('image');
    var picSrc = pic.src;
    var fullSrc = picSrc.split('h.jpg')[0] + '.jpg';
    pic.src = fullSrc;
    pic.addEventListener("DOMAttrModified", function(event) {
        if (i == 0 && event.attrName == "src") {
        pic = document.getElementById('image');
        i = 1;   // this is to prevent endless loop
        picSrc = pic.src;
        fullSrc = picSrc.split('h.jpg')[0] + '.jpg';
        pic.src = fullSrc;
        }
});
return true;
};

根据页面的具体工作方式（如果没有现实世界的用例，我看不到），您可能还需要重新分配整个mousedown事件。

Answer 2

在每个mousedown上添加一个新的DOMAttrModified事件监听器。

尝试将代码安排到以下内容：

var pic = document.getElementById('image');
var i;

pic.addEventListener("DOMAttrModified", function(event) {
        if (i == 0 && event.attrName == "src") {
        //pic = document.getElementById('image');
        i = 1;   // this is to prevent endless loop
        picSrc = pic.src;
        fullSrc = picSrc.split('h.jpg')[0] + '.jpg';
        pic.src = fullSrc;
        i = 0;
    });

document.getElementById('next').onmousedown = function () {
    var picSrc = pic.src;
    var fullSrc = picSrc.split('h.jpg')[0] + '.jpg';
    pic.src = fullSrc;
});

您还应该尝试使用addEventListener代替onmousedown

检测img src然后用javascript更改它

2 个答案: