如何接受 getElementById (stackoverflow) 之间的任何字符？ [复制]答案

【问题标题】：How to accept any characters in between * of an getElementById (stack_ * _overflow)? [duplicate]如何接受 getElementById (stackoverflow) 之间的任何字符？ [复制]
【发布时间】：2013-08-29 07:01:54
【问题描述】：

我有一个页面，每次都会更改输入字段的 ID。例如，如果我现在访问该页面，ID 可以是"stack_15_overflow"，下一次可以是"stack_293_overflow"。

我想为getElementById 使用通配符值，例如"stack_ * _overflow"（其中* 匹配任何内容），以获取与以某些特定文本开头和结尾的任何输入字段相关的值，无论是什么文本介于两者之间。

代码：

function HelloId(string){
    var name=string
    document.getElementById('stack_*_overflow').value=name;
}

【问题讨论】：

如果你控制 HTML 使用一个类并且不要做这个“奇怪”的选择器的东西。比这是一个简单的调用。
阅读这篇文章，它也会有所帮助stackoverflow.com/questions/5376431/…

标签： javascript jquery

【解决方案1】：

使用 jQuery 的 attribute starts with 和 attribute ends with 选择器：

$("[id^='stack'][id$=overflow]");

请注意，这些选择器很昂贵，指定元素的类型可以提高性能：

$('element').filter("[id^='stack'][id$=overflow]");

【讨论】：

你对这种“昂贵”有兴趣吗？我很确定querySelectorAll 本身就支持这些属性选择器，所以我不明白你为什么要使用.filter() 来强制执行 2 个 DOM 查询对于 自定义 jQuery 选择器而言会有所不同>。另外，我很确定选择器是从右到左评估的，所以添加 element 部分不会加快任何速度，它只是过滤结果集。不过我可能对那部分有误 - 可能只是当你在选择器中有一个空格时，这些部分是从右到左评估的 - 但是每个“组”都是从左到右评估的

【解决方案2】：

var elements = document.querySelectorAll('[id^="stack_"][id$="_overflow"]');

【讨论】：

为什么是querySelectorAll？这是通过id 获取一个元素，它应该只返回 1 个元素...
@Ian * 是通配符（在问题中）。这将选择许多具有许多不同 id 的元素。
@Ian，我猜他可能有许多不同 id 的输入遵循相同的模式。 querySelectorAll 这里的使用更值得怀疑，因为 OP 已经使用了 jQuery。
* 无关，不是我的意思。我错过了文本“任何以某些特定文本开头和结尾的输入字段”，这是重要的部分
@plalx 他将它标记为 jquery，但从他在问题中显示的代码来看，我不太确定他是否真的在使用它。这就是我提供这个解决方案的原因。如果他已经在使用 jQuery，那么这显然不如 undefined 的答案好（而且不像跨浏览器）。

【解决方案3】：

使用getElementById 无法实现此目的。更好的解决方案是 querySelector 或 querySelectorAll，您可以在其中获得对 CSS 选择器的全面支持。

Reference at MDN

您将需要以下 2 个属性选择器：

获取以特定字符串开始的元素

document.querySelector('[id^="stack_"]');

获取包含特定字符串的元素

document.querySelector('[id*="stack_"]');

获取以特定字符串结束的元素

document.querySelector('[id$="_overflow"]');

通过组合结束和开始选择器，您可以获得以下结果并能够达到您想要的结果：

document.querySelector('[id^="stack_"][id$="_overflow"]');

编码愉快！

【讨论】：

谢谢你，就像一个魅力！

【解决方案4】：

代码：

$("body:regex(id, stack_[0-9]+_overflow)");

using this plugin

【讨论】：