jQuery JS 如何改变页面上的数字

Posted 2022-12-12 mqy1023

只需要在控制台上执行下面代码，就可改变页面上相应内容的值

一、高亮页面上的所有数字

(function hilightNumber(jqObj) 
    // 不能替换script标签里的数字
    var domObj = jqObj[0];
    if (domObj.nodeName == "SCRIPT") 
        return;
    
    // 如果标签里有标签，我们也不作替换，而是递归进去遍历内层的标签。
    var children = jqObj.children();
    if (children.length > 0) 
        for(var i=0; i<children.length; i++) 
            hilightNumber($(children[i]));
        
     else 
    // 标签里只有文字，没有内层标签的时候，才做替换，
    // 把123替换成带颜色的标签内包含123，就实现了高亮。
        var hilightedhtml = jqObj.html().replace(/([+\\-]?[0-9]+(\\.[0-9]+)?)/g, "<span style='background:yellow;'>$1</span>");
        jqObj.html(hilightedHtml);
    
)($("body"));

二、改变金额数字

23,233,23元 => 23,233,23 * 0.9 元

(function hilightNumber(jqObj) 

    var discount = 0.9

    // 不能替换script标签里的数字
    var domObj = jqObj[0];
    if (domObj.nodeName == "SCRIPT") 
        return;
    
    // 如果标签里有标签，我们也不作替换，而是递归进去遍历内层的标签。
    var children = jqObj.children();
    if (children.length > 0) 
        for(var i=0; i<children.length; i++) 
            hilightNumber($(children[i]));
        
     else 
    // 标签里只有文字，没有内层标签的时候，才做替换，
    // 把123替换成带颜色的标签内包含123，就实现了高亮。
        var hilightedHtml = jqObj.html().replace(/^(([1-9][0-9]0,2(,\\d3)*)|0)(\\.\\d1,2)元$/g, function(word)
          
          word = word.replace(',', "")
          word = word.replace('元', "")
          word = word.replace('.', "")
          word = parseInt(word * discount) + ""

          pointStr = word.substring(word.length-2)
          headNum = word.substring(0, word.length-2)
          headNum1 = headNum.replace(/(?=(?!(\\b))(\\d3)+$)/g, ",")
          
          return headNum1 + "." + pointStr + "元"
          
        );
        jqObj.html(hilightedHtml);
    
)($("body"));