How to change value of element if I only know aria-desribedby?-CodePudding

I have a grid in my code and I am trying to change the values it displays( it displays true or false), but I only know the grid's cell's aria-describedby is "GridMaksajumi_BezApmaksas" My grid looks like this:

<table id="GridMaksajumi" tabindex="0" cellspacing="0" cellpadding="0" border="0" role="grid" aria-multiselectable="false" aria-labelledby="gbox_GridMaksajumi"  style="width: 1020px;">
    <tbody>
        <tr  role="row" style="height:auto">
            <td role="gridcell" style="height:0px;width:250px;"></td>
            <td role="gridcell" style="height:0px;width:250px;"></td>
            <td role="gridcell" style="height:0px;width:250px;"></td>
            <td role="gridcell" style="height:0px;width:250px;"></td>
            <td role="gridcell" style="height:0px;width:150px;display:none;"></td>
            <td role="gridcell" style="height:0px;width:150px;display:none;"></td>
        </tr>
        <tr role="row" id="19fbd3d0-06f6-4aad-afd6-07d8d49a9e52" tabindex="-1"  aria-selected="false">
            <td role="gridcell" style="text-align:left;" title="13" aria-describedby="GridMaksajumi_ApmaksasSumma">13</td>
            <td role="gridcell" style="text-align:left;" title="10.06.2022" aria-describedby="GridMaksajumi_ApmaksasDatums">10.06.2022</td>
            <td role="gridcell" style="text-align:left;" title="false" aria-describedby="GridMaksajumi_BezApmaksas">false</td>
            <td role="gridcell" style="text-align:left;" title="asfasfasfasf" aria-describedby="GridMaksajumi_Piezīmes">asfasfasfasf</td>
            <td role="gridcell" style="text-align:left;display:none;" aria-describedby="GridMaksajumi_Id">19fbd3d0-06f6-4aad-afd6-07d8d49a9e52</td>
            <td role="gridcell" style="text-align:left;display:none;" aria-describedby="GridMaksajumi_Version">0</td>
        </tr>
        <tr role="row" id="9bec735b-0cd9-4abe-b2ea-1233708aac9f" tabindex="0"  aria-selected="true">
            <td role="gridcell" style="text-align:left;" title="13" aria-describedby="GridMaksajumi_ApmaksasSumma">13</td>
            <td role="gridcell" style="text-align:left;" title="10.06.2022" aria-describedby="GridMaksajumi_ApmaksasDatums">10.06.2022</td>
            <td role="gridcell" style="text-align:left;" title="false" aria-describedby="GridMaksajumi_BezApmaksas">false</td>
            <td role="gridcell" style="text-align:left;" title="asfasfasfasf" aria-describedby="GridMaksajumi_Piezīmes">asfasfasfasf</td>
            <td role="gridcell" style="text-align:left;display:none;" aria-describedby="GridMaksajumi_Id">9bec735b-0cd9-4abe-b2ea-1233708aac9f</td>
            <td role="gridcell" style="text-align:left;display:none;" aria-describedby="GridMaksajumi_Version">0</td>
        </tr>
    </tbody>
</table>

And I am trying to change the value of aria-describedby="GridMaksajumi_BezApmaksas"

Thanks for help in advance

CodePudding user response：

The selector you are looking for is [aria-describedby="GridMaksajumi_BezApmaksas"]

Here's a demo changing those values to "changed":

let objs = document.querySelectorAll('[aria-describedby="GridMaksajumi_BezApmaksas"]');
for(obj of objs){
  obj.innerText = "changed";
}

<table id="GridMaksajumi" tabindex="0" cellspacing="0" cellpadding="0" border="0" role="grid" aria-multiselectable="false" aria-labelledby="gbox_GridMaksajumi"  style="width: 1020px;">
    <tbody>
        <tr  role="row" style="height:auto">
            <td role="gridcell" style="height:0px;width:250px;"></td>
            <td role="gridcell" style="height:0px;width:250px;"></td>
            <td role="gridcell" style="height:0px;width:250px;"></td>
            <td role="gridcell" style="height:0px;width:250px;"></td>
            <td role="gridcell" style="height:0px;width:150px;display:none;"></td>
            <td role="gridcell" style="height:0px;width:150px;display:none;"></td>
        </tr>
        <tr role="row" id="19fbd3d0-06f6-4aad-afd6-07d8d49a9e52" tabindex="-1"  aria-selected="false">
            <td role="gridcell" style="text-align:left;" title="13" aria-describedby="GridMaksajumi_ApmaksasSumma">13</td>
            <td role="gridcell" style="text-align:left;" title="10.06.2022" aria-describedby="GridMaksajumi_ApmaksasDatums">10.06.2022</td>
            <td role="gridcell" style="text-align:left;" title="false" aria-describedby="GridMaksajumi_BezApmaksas">false</td>
            <td role="gridcell" style="text-align:left;" title="asfasfasfasf" aria-describedby="GridMaksajumi_Piezīmes">asfasfasfasf</td>
            <td role="gridcell" style="text-align:left;display:none;" aria-describedby="GridMaksajumi_Id">19fbd3d0-06f6-4aad-afd6-07d8d49a9e52</td>
            <td role="gridcell" style="text-align:left;display:none;" aria-describedby="GridMaksajumi_Version">0</td>
        </tr>
        <tr role="row" id="9bec735b-0cd9-4abe-b2ea-1233708aac9f" tabindex="0"  aria-selected="true">
            <td role="gridcell" style="text-align:left;" title="13" aria-describedby="GridMaksajumi_ApmaksasSumma">13</td>
            <td role="gridcell" style="text-align:left;" title="10.06.2022" aria-describedby="GridMaksajumi_ApmaksasDatums">10.06.2022</td>
            <td role="gridcell" style="text-align:left;" title="false" aria-describedby="GridMaksajumi_BezApmaksas">false</td>
            <td role="gridcell" style="text-align:left;" title="asfasfasfasf" aria-describedby="GridMaksajumi_Piezīmes">asfasfasfasf</td>
            <td role="gridcell" style="text-align:left;display:none;" aria-describedby="GridMaksajumi_Id">9bec735b-0cd9-4abe-b2ea-1233708aac9f</td>
            <td role="gridcell" style="text-align:left;display:none;" aria-describedby="GridMaksajumi_Version">0</td>
        </tr>
    </tbody>
</table>