通过名称或 ID 的一部分获取元素 [英] Get element by part of Name or ID
问题描述
这是我的表单示例(只有我想要的输入,但还有很多其他的):
Here is an example of my form (only inputs that I want, but there is many others):
<form name="inputform" action="..." method="post">
<input type="hidden" name="id_qtedje_77" id="id_qtedje_77" value="0">
<input type="text" id="id_qte_77" name="prestation_detail_fields[77][qte_collecte]" value="0.00">
<input type="text" id="id_rec_77" name="prestation_detail_fields[77][reliquat_conforme]" value="0.00">
<input type="text" id="id_ren_77" name="prestation_detail_fields[77][reliquat_non_conforme]" value="0.00">
<input type="checkbox" name="prestation_detail_fields[77][dechet_non_present]" value="1">
<!-- another TR -->
<input type="hidden" name="id_qtedje_108" id="id_qtedje_108" value="0">
<input type="text" id="id_qte_108" name="prestation_detail_fields[108][qte_collecte]" value="0.00">
<input type="text" id="id_rec_108" name="prestation_detail_fields[108][reliquat_conforme]" value="0.00">
<input type="text" id="id_ren_108" name="prestation_detail_fields[108][reliquat_non_conforme]" value="0.00">
<input type="checkbox" name="prestation_detail_fields[108][dechet_non_present]" value="1">
</form>
我想要的是获取输入的值,但由于表单是用 PHP 构建的,我不知道行标识符 (77, 108).
What I want is to get values of inputs, but as the form is built in PHP, I don't know the line identifier (77, 108).
有没有办法做类似 getElementByName('id_qtedje_%')
的事情?
Is there a way to do something like getElementByName('id_qtedje_%')
?
注意:我没有使用任何库,也不打算使用.
Note: I'm not using any library, and I don't plan to use one.
推荐答案
你最好的选择可能是 document.querySelectorAll
,您可以使用任何 CSS 选择器,包括 "属性以选择器"开头,例如input[id^="id_qtedje_"]
.支持所有现代浏览器以及 IE8:
Your best bet is probably document.querySelectorAll
, which you can use any CSS selector with, including an "attribute starts with" selector like input[id^="id_qtedje_"]
. It's supported on all modern browsers, and also IE8:
var elements = document.querySelectorAll('input[id^="id_qtedje_"]');
如果您只想要第一个匹配项(而不是列表),您可以使用 document.querySelector
代替.它返回对文档顺序中第一个匹配项的引用,如果没有匹配项,则返回 null
.
If you wanted just the first match (rather than a list), you could use document.querySelector
instead. It returns a reference to the first match in document order, or null
if nothing matched.
或者,您可以给元素一个类名,然后使用 document.getElementsByClassName
,但请注意,虽然旧版本的 Chrome 和 Firefox 支持 getElementsByClassName
,但 IE8 没有它,所以它是 不像现代更有用的 querySelectorAll
那样受支持.
Alternately, you could give the elements a class name, then use document.getElementsByClassName
, but note that while getElementsByClassName
was supported in old versions of Chrome and Firefox, IE8 doesn't have it, so it's not as well-supported as the more-useful querySelectorAll
in the modern era.
var elements = document.getElementsByClassName("theClassName");
如果你使用任何库(jQuery、MooTools、Closure、Prototype 等),它们很可能有一个函数,你可以用它来通过几乎任何 CSS 选择器查找元素,填补浏览器支持的空白他们自己的代码.例如,在 jQuery 中,它是 $
(jQuery
) 函数;在 MooTools 和 Prototype 中,它是 $$
.
If you use any libraries (jQuery, MooTools, Closure, Prototype, etc.), they're likely to have a function you can use to look up elements by just about any CSS selector, filling the gaps in browser support with their own code. For instance, in jQuery, it's the $
(jQuery
) function; in MooTools and Prototype, it's $$
.
这篇关于通过名称或 ID 的一部分获取元素的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!