Firefox 可以在选项卡标题中的名称之前显示图像的分辨率吗?

Can Firefox show resolution of image before name in tab title?

问题:

Can Firefox show resolution of image before its name in title? If an image has a name too big I can't read its resolution, and that bugs me.

(asked by supasd)

I've done some research,尚未成功。

你们中有人碰巧知道怎么做吗? smartest/most 有效的方法是什么?可以用 userstyle 来完成吗?还是需要用户脚本 或add-on?随时提供任何类型的建议或解决方案,无论是用户风格还是其他。

最简单的代码是在加载文档时更改标题:

// ==UserScript==
// @name         Image dimensions before title
// ==/UserScript==

(function() {
    var m = document.title
                    .match(/^(.+?\.\w+) \((?:([^,]+?), )?(\d+)\s*[x×]\s*(\d+)( .+?)?\)/);
    if (m)
        document.title = m[3] + 'x' + m[4] + ' ' + m[1] + (m[2] ? ' (' + m[2] + ')' : '');
})();

使用 MutationObserver 可以在浏览器设置标题时立即更改标题而不会闪烁。正则表达式适用于 Firefox 和 Chrome,并将尺寸移动到文件名之前。 DOMContentLoaded 事件侦听器仍用于覆盖其他 addons/userscripts 的不利影响,例如 CenterImage 会破坏 <HEAD> 元素。

// ==UserScript==
// @name         Image dimensions before title
// @run-at       document-start
// ==/UserScript==

if (!changeTitle()) {
    new MutationObserver(function(mutations) {
        var nodes = mutations[0].addedNodes;
        if (nodes[0] && nodes[0].localName == 'title' && changeTitle(nodes[0])
        || document.body && document.body.children.length) {
            this.disconnect();
        }
    }).observe(document, {subtree: true, childList: true});
}
document.addEventListener('DOMContentLoaded', changeTitle);

function changeTitle(node) {
    var m = document.title
                    .match(/^(.+?\.\w+) \((?:([^,]+?), )?(\d+)\s*[x×]\s*(\d+)( \w+)?\)/);
    if (m) {
        document.title = m[3] + 'x' + m[4] + ' ' + m[1] + (m[2] ? ' (' + m[2] + ')' : '');
        return true;
    }
}