jQuery如何传入id文本参数实现DOM元素的间接选择操作

核心逻辑很简单：jQuery的ID选择器规则是#拼接id字符串，你只要把传入的id参数拼成合法的选择器，传入jQuery构造函数就能得到对应的jQuery对象，也就是你代码里要的$x。

基础实现 #

如果传入函数的elname是不带#前缀的纯id值（比如传入"submitBtn"对应id为submitBtn的元素），直接拼接选择器即可：

function doit(elname) {
  // 生成对应元素的jQuery对象
  const $x = $(`#${elname}`);
  // 后续可以正常调用所有jQuery方法，举个实际使用的例子
  $x.attr("disabled", true);
}

// 调用示例：操作id为username的元素
doit("username");

如果传入的参数本身已经带了#前缀（比如传入"#submitBtn"），那不需要额外拼接，直接写const $x = $(elname)即可。

兼容特殊id的稳妥写法 #

如果你的id里可能包含.、:、[这类jQuery选择器的保留特殊字符，直接拼接会导致选择器解析错误，这时候用jQuery自带的$.escapeSelector()方法转义id即可：

function doit(elname) {
  const $x = $(`#${$.escapeSelector(elname)}`);
  $x.attr();
}

比如id为user.input的元素，不转义的话jQuery会把它识别成「id为user的元素下class为input的后代元素」，转义后就能精准匹配到id本身。

你之前见过的$x写法本质就是缓存选中的jQuery对象，和直接写$('#xxx').attr()的效果完全一致，把选择器里的id部分抽成函数参数传入，就实现了间接选择的需求。

内容的提问来源于stack exchange，提问作者frabersnatch