这些教程展示了在Jquery选择器中使用javascript变量的多种方法。
Jquery选择器用于从DOM树中选择一个元素,使用element,id, 和class 选择器。
让我们声明带有id 和class 属性的div
<div id="headingId" class="heading">Text example</div>
你可以使用javascript改变里面的内容
$("#headingId").innerHTML = "Div Example";
上面的div是用id字符串选择的。
我们可以在JQuery中传递一个变量作为选择器吗?
是的,这是有可能的
Jquery选择器为一个javascript变量。
让我们在HTML中声明一个文本框。
<input type="text" id="fname" class="inputtext"/>
让我们看看使用变量来选择文本框的多种方法。
在这个例子中,使用变量的Jquery选择器改变文本框的值。用id字符串声明一个变量
使用ES6模板变量语法。
模板变量语法是在ES6中添加的。使用插值语法,用双引号声明和访问变量。
let selector="fname"
$('input[id=${selector}]').val("new value");
另一种方法是使用字符串连接法
使用+运算符将#添加到变量选择器中,如下图所示
let selector="fname"
$('input[id="'+selector+'"]').val("new value");
另一种方法是使用id选择器
let selector="fname"
$('#"'+selector+'"').val("new value");
以同样的方式,我们可以使用一个类选择器。
let selector="inputtext"
$('".'+selector+'"').val("new value");
总结
综上所述,我们可以在jquery选择器中使用javascript变量来选择DOM元素。