在 querySelector 中使用变量和 id

مسع*_*عود -2 javascript jquery-selectors

我想使用 querySelector 从输入列中获取值。我需要使用两个 id 来获取正确的列。第二个 id 存储在变量中,它是一个整数值。我尝试过不同的事情,但我没有得到任何东西。目前它给我空。

 checkDescriptionField = document.querySelector('#methodProperties input#'+'descriptionFieldId'); 
 if(typeof checkDescriptionField !== 'undefined' && checkDescriptionField !== null)
        {
            descriptionFieldValue = document.querySelector('#methodProperties input#'+'descriptionFieldId').textContent; 
        }
Run Code Online (Sandbox Code Playgroud)

外部 id 是 methodProperties ,内部是 input id="0eca409e-e2f7-467d-bd5e-dff9b63e3715" ,我想获取其值 ="Customers"

<div id="methodProperties">
<td role="gridcell">
<input id="0eca409e-e2f7-467d-bd5e-dff9b63e3715" class="k-textbox gridTable propertiesField" value="Customers" readonly="" data-role="droptarget"   type="text">
<span class="errorTooltip" style="display: none;">
<span class="deleteTooltip" style="padding: 5px; display: inline;" title="Delete Value" data-role="tooltip">
</td>
Run Code Online (Sandbox Code Playgroud)

我尝试了这个,但收到无效错误

checkDescriptionField = document.querySelector('#methodProperties input#'+descriptionFieldId); 
if(typeof checkDescriptionField !== 'undefined' && checkDescriptionField !== null)
        {
            descriptionFieldValue = document.querySelector('#methodProperties input#'+descriptionFieldId).textContent; 
        }
Run Code Online (Sandbox Code Playgroud)

gur*_*372 5

外部 id 是 methodProperties ,内部是 input id="0eca409e-e2f7-467d-bd5e-dff9b63e3715" ,我想获取其值 ="Customers"

尝试这个

descriptionFieldValue = document.querySelector( '#' + descriptionFieldId ).value; 
Run Code Online (Sandbox Code Playgroud)

或者因为 a 中只有一个输入methodProperties

descriptionFieldValue = document.querySelector( '#methodProperties input' ).value; 
Run Code Online (Sandbox Code Playgroud)

如果要重复 id,请使用 data-id 属性

<div data-id="methodProperties">
  <td role="gridcell">
    <input value="customers">
  </td>
</div>
Run Code Online (Sandbox Code Playgroud)

和 js 作为

descriptionFieldValue = document.querySelector( 'div[data-id="methodProperties"] input' ).value;  //this will take the value from first methodProperties
Run Code Online (Sandbox Code Playgroud)