2023-01-31 15:44:25 版本 : 常用JS代码
作者: 周杨 于 2022年06月15日 发布在分类 / 计算机应用 / 编程 下,并于 2023年01月31日 编辑
 历史版本

备注 修改日期 修改人
格式调整 2024-01-24 14:19:47[当前版本] 周杨
其他原因...增加仅保留某选择项代码 2023-05-10 11:21:18 系统管理员
其他原因...增加“8.判断当前页面是否为弹窗​” 2023-01-31 15:44:25 系统管理员
其他原因...增加“7.获取动态ID” 2022-12-23 11:02:03 系统管理员

JS编写完毕上传至生产环境,建议将其压缩,在线压缩:https://c.runoob.com/front-end/51/


1.特定条件下给表格单元格设置背景色

< script >
    var rows = document. getElementById( "tbody_8a7e83b852865bf801538383168269ed"). rows. length; //获取表格行数
    if ( rows > 0 ){
    for( var i = 0; i< rows; i++){
        var lowprice = document. getElementById( "field_8a7e85e38113421d01813c0d4d07154c_" + i
        if ( lowprice. value < 0.3){

            lowprice. parentElement. style. backgroundColor= "yellow"; //
        }
    }
}
</ script >


2.根据元素值设置超链接


< script > function proj( obj) {
    var projNo = document. getElementById( 'field_8a7e83b851c2ef540151d2d2a9947d43'). value;
    if ( projNo. length > 0) {
        obj. target = "_blank";
        obj. href = "https://xxx.xxx.com?projNo=" + projNo
    } else {
        alert( "未获取到约定书编号,请刷新页面重新点击!")
    }
    obj. click()
}
</ script >

<!-- html调用 -->
< a onclick= proj ( this ) href= "javascript:void(0)" >超级链接 </ a >


3.删除特定下拉框选项

< script > window. onload = function() {
    var obj = document. getElementById( 'field_8a7e85e380352b34018040cfb9dd1fae');
    var count = obj. length;
    var j = 1;
    for ( var i = 0; i < count; i++) {
        if ( obj[ j]. value == "f7d4d4345cc91c89015ccf156515616e" || obj[ j]. value == "8a7e85e37ca0b4ef017ca7381c0c1557") {
            j++;
        }
        obj. options. remove( j);
    }
}
</ SCRIPT >



4.根据网页文本关键字查找对应元素ID

< script >

    var obj = document.getElementsByClassName("txtflow");

    //document.getElementsByName,document.getElementsByTagName    

    var n = obj. length;
    var result = '';
    var keyWord = '关键字'
    for ( var i = 0; i < n; i++) {
        //obj[i].innerHTML和obj[i].innerText包含当前节点下的所有子节点
        if ( obj[ i]. firstChild. nodeValue. indexOf( keyWord) != - 1) {
            result = obj[ i]. id;
            break;
        }
    }
</ script >

5.获取URL中的参数值

< script >
    function getQueryVariable( variable) {
        var query = window. location. search. substring( 1);
        var vars = query. split( "&");
        for ( var i = 0; i < vars. length; i++) {
            var pair = vars[ i]. split( "=");
            if ( pair[ 0] == variable) { return pair[ 1]; }
        }
        return ( false);
    }
    var url = document. URL;
    var id = getQueryVariable( "id");
</ script >


此代码常常与设置动态超链功能配合使用


6.监听某个按钮被点击

< script >
document. getElementById('btn'). addEventListener("click", function() {
    console. log( "点击了添加按钮");
    //添加触发其他动作函数
});
</ script >

注意:addEventListener不兼容IE低版本,若需要兼容请用以下代码

https://help.dwcpa.com.cn:9443/webdoc/view/Pub8a7e859d8150bc9f018287a906c2247e.html

例1:

<! DOCTYPE html >
< html >

< head >
    < meta charset= "UTF-8" >

    < title >Document </ title >
</ head >

< body >
    < input id= "btn" type= "button" value= "按钮" >
</ body >
< script >
    document. getElementById( 'btn'). addEventListener( "click", function () {
        console. log( "点击了添加按钮");
    });
</ script >

</ html >


例2:点击表格添加行按钮则删除行中某字段下拉第3、4的选择项

< script >
    function removeoOptino( tableID, fieldID) {
    var rows = document. getElementById( tableID). rows. length;
    if ( rows > 0) {
        for ( var i = 0; i < rows; i++) {
            var obj = document. getElementById( fieldID + "_" + i)
            obj. options. remove( 3);
            obj. options. remove( 2);
        }
    }
}
    document. getElementById( 'add_otable8a7e83b855d7d649015600c65ddb2830'). addEventListener( "click", function() {
    console. log( "点击了添加按钮");
    removeoOptino( "oTable8a7e83b855d7d649015600c65ddb2830", "field_8a7e85e3705d92340170e6904d9e3103");
 })
</ SCRIPT >


7.获取动态ID

例1:获取当前节点及所有子节点中第一个关键字的ID

    var obj = document.getElementsByClassName("naviSecond");
    var n = obj.length;
    var result = '';
    var keyWord = '关键字'
    for (var i = 0; i < n; i++) {
        if (obj[i].firstChild.nodeValue.indexOf(keyWord) != -1) {
            result = obj[i].id;
            break;
        }
    }
    return result
例2:获取当前节点的父节点的ID,若获取失败返回特定值

function(){
    try {
        var result = document.getElementsByClassName( "x-grid3-row x-grid3-row-first")[0].parentNode.id;
        return result
    } catch(e) {
      return 123
    }
}

8.判断当前页面是否为弹窗

if (window.opener != null)
    // 此页面为弹窗
else
    // 此页面不是弹窗
在特定场景关闭弹窗就可以使用该代码

历史版本-目录  [回到顶端]
    知识分享平台 -V 5.1.4 -大信谛威