zoukankan      html  css  js  c++  java
  • 高级图像替换

    var ImageReplace = {
            replaceImage: function (element) {
                // 取得元素
                element = ADS.$(element);
                // 创建图像元素
                var image = document.createElement('img');
    
                // 当图像载入成功后再添加span和类名
                ADS.addEvent(image, 'load', function () {
    
                    var s = document.createElement('span');
                    // 将span添加为元素的子元素
                    ADS.prependChild(element, s);
    
                    // 创建必要的title属性
                    if (!element.getAttribute('title')) {
                        var i, child;
                        var title = '';
                        // 循环遍历子元素以组合title属性
                        for (i = 0; child = element.childNodes[i]; i++) {
                            if (child.nodeValue) {
                                title += child.nodeValue;
                            }
                        }
                        element.setAttribute('title', title);
                    }
                    // 修改类名以标明
                    // 变更并应用css
                    ADS.addClassName(element, 'advancED');
                });
    
                // 载入图像
                var styleSheet = ADS.getStyleSheets('advancED.css')[0];
    
                if (!styleSheet) {
                    return;
                }
                var list = styleSheet.cssRules || styleSheet.rules;
    
                if (!list) {
                    return;
                }
                var j, rule;
                for (j = 0; rule = list[j]; j++) {
                    // 查找规则
                    // 可能是#element-id span
                    // 或者 .advancED#element-id span
                    // 或者MSIE中的, .advancED#element-id SPAN
                    // 其中element-id是传递到方法中的参数
                    if (rule.selectorText.indexOf('#' + element.id) !== -1
                            && rule.selectorText.indexOf('.advancED') !== -1
                            && rule.selectorText.toUpperCase().indexOf(' SPAN') !== -1) {
                        // 使用正则表达式: /url\(([^\)]+)\)/
                        // 在css规则中查找url
                        var matches = rule.style.cssText.match(/url\(([^\)]+)\)/);
                        // matches[1]中包含的是与正则表达式
                        // 匹配的捕获圆括号中的值
                        if (matches[1]) {
                            image.src = matches[1].replace(/"/g, '');
                            break;
                        }
                    }
                }
            },
            run: function (elem) {
                var that = this;
                ADS.addEvent(window, 'load', function () {
                    that.replaceImage(elem);
                });
            }
        };
    
        ImageReplace.run('advancedHeader');
    

      

  • 相关阅读:
    C++自定义异常类
    上下栏固定, 中间滚动的HTML模板
    C# 代理应用
    C# 对象池的实现(能限制最大实例数量,类似于WCF的MaxInstanceCount功能)
    半同步半异步模式的实现
    EventBus实现
    C Socket初探
    C Socket初探
    VC++全屏
    MFC 坦克定位
  • 原文地址:https://www.cnblogs.com/webFrontDev/p/2820387.html
Copyright © 2011-2022 走看看