Автоматизированный сценарий DD Belated png

Question

Я уже некоторое время использую http://www.dillerdesign.com/experiment/DD_belatedPNG/, и это решило большинство моих болей в IE6 png.

Интересно, есть ли способ автоматизировать его, чтобы яне засоряйте мой код с помощью class = "png" и не добавляйте идентификаторы html-элементов с использованием фоновых изображений в файл JS.- Мне все равно, что это может замедлить работу IE6. - Клиенту проще объяснить, что сайт работает медленно из-за браузера, чем объяснить, почему все имеет серый фон!

I 'Я на самом деле не эксперт по JS, но, думаю, захватить атрибут src и добавить имя файла в класс не сложно.- Каким-то образом анализ CSS и добавление идентификатора содержащего элемента звучит сложно, если не невозможно, хотя

Answer 1

Это не проверено, но вот мое решение jQuery, которое должно работать.Он в основном проверяет все элементы img для расширения .png, затем проверяет все элементы, кроме img, для фонового изображения с расширением .png

Возможно, вам потребуется добавить дополнительный код, чтобы проверить свойство фона CSS, а также фон-образ.С помощью селектора body * я мог бы представить много лишних затрат на страницах с большим количеством элементов, но я с вами, мне все равно, сколько времени пользователям IE6 потребуется для загрузки страницы, если они не заботятся об обновлении своего браузера

$(function() {
    $('img').each(function() {
            if(this.src.split('.').pop() == 'png') {
                    DD_belatedPNG.fixPng(this)
            }
    });
    $('body *:not(img)').each(function() {
            if($(this).css('background-image').split('.').pop().replace(/("|\')\)/,'') == 'png') {
                    DD_belatedPNG.fixPng(this);
            }
    });
});

РЕДАКТИРОВАТЬ: Я нашел это довольно интересной задачей, поэтому написал чистое решение JavaScript.Его нужно запустить, когда DOM будет готов, поэтому, если вы действительно не хотите использовать jQuery или другую инфраструктуру с функцией DOM ready, вам придется использовать метод Дина Эдвардса, например:

document.write('<script type="text/javascript" id="domready" defer="defer" src="javascript:void(0)"><\/script>');
document.getElementById("domready").onreadystatechange = function() {
    if (this.readyState == "complete") {
        var imgs = document.getElementsByTagName('img')
        for(i=0; i < imgs.length; i++) {
            if(imgs[i].src.toLowerCase().search(/\.png$/) != -1) {
                DD_belatedPNG.fixPng(imgs[i]);
            }
        }

        var children = document.body.getElementsByTagName('*');
        for(i=0; i < children.length; i++) {
            var bg = children[i].currentStyle.backgroundImage;
            if(bg != 'none' && bg.toLowerCase().search(/\.png("|\')?\)$/) != -1) {
                DD_belatedPNG.fixPng(children[i]);
            }
        }
    }
}