<form class="form-poll" id="poll-1225962377536" action="/cs/Satellite">
该ID总是以poll-开头，其余数字是动态的。
我如何只使用JavaScript而不是jQuery来获取该ID？
document.querySelector('[id^="poll-"]').id;
[id] 以字符串 "poll-" 开头的元素。
^ 匹配开头
* 匹配任意位置
$ 匹配结尾
示例
console.log(document.querySelector('[id^=poll-]').id)<form id="poll-1225962377536"></form>querySelectorAll 很好用。但是 document.querySelectorAll('[id^="poll-"]') 返回的是一个列表。我们需要遍历这个列表，获取id，而不能使用 document.querySelectorAll('[id^="poll-"]').id。 - Sophia Feng^匹配字符串开头，$匹配字符串结尾，*匹配字符串中的任意位置。在你的例子中应该使用id$="dynamic_constant"。 - A1rPun[id^=user-][id$=-image] :) - A1rPun试一下这个。
function getElementsByIdStartsWith(container, selectorTag, prefix) {
var items = [];
var myPosts = document.getElementById(container).getElementsByTagName(selectorTag);
for (var i = 0; i < myPosts.length; i++) {
//omitting undefined null check for brevity
if (myPosts[i].id.lastIndexOf(prefix, 0) === 0) {
items.push(myPosts[i]);
}
}
return items;
}
示例HTML标记。
<div id="posts">
<div id="post-1">post 1</div>
<div id="post-12">post 12</div>
<div id="post-123">post 123</div>
<div id="pst-123">post 123</div>
</div>
调用方法：
var postedOnes = getElementsByIdStartsWith("posts", "div", "post-");
querySelectorAll现代枚举方法polls = document.querySelectorAll('[id ^= "poll-"]');
Array.prototype.forEach.call(polls, callback);
function callback(element, iterator) {
console.log(iterator, element.id);
}
id元素。
第二行调用枚举和回调函数。如果您想根据前缀确定元素的完整id，则必须搜索整个DOM（或至少搜索整个子树，如果您知道某个元素始终包含目标元素）。 您可以使用以下内容执行此操作：
function findChildWithIdLike(node, prefix) {
if (node && node.id && node.id.indexOf(prefix) == 0) {
//match found
return node;
}
//no match, check child nodes
for (var index = 0; index < node.childNodes.length; index++) {
var child = node.childNodes[index];
var childResult = findChildWithIdLike(child, prefix);
if (childResult) {
return childResult;
}
}
};
我不完全确定你在问什么，但是你可以使用字符串函数来创建你所需要的实际ID。
var base = "common";
var num = 3;
var o = document.getElementById(base + num); // will find id="common3"
// get a list of all form objects that have the right type of ID
function findPollForms() {
var list = getElementsByTagName("form");
var results = [];
for (var i = 0; i < list.length; i++) {
var id = list[i].id;
if (id && id.search(/^poll-/) != -1) {
results.push(list[i]);
}
}
return(results);
}
// return the ID of the first form object that has the right type of ID
function findFirstPollFormID() {
var list = getElementsByTagName("form");
var results = [];
for (var i = 0; i < list.length; i++) {
var id = list[i].id;
if (id && id.search(/^poll-/) != -1) {
return(id);
}
}
return(null);
}
你可能需要给它一个常量类并调用getElementsByClassName，或者只是使用getElementsByTagName，并循环遍历结果，检查名称。
我建议您查看底层问题，并找出一种可以预先知道ID的方法。
也许如果您发布了更多关于为什么会出现这种情况的信息，我们可以找到更好的替代方案。
您可以使用 id 属性获取 id，然后使用 substr 方法删除其前面的部分，最后可选地使用 parseInt 将其转换为数字：
var id = theElement.id.substr(5);
或者：
var id = parseInt(theElement.id.substr(5));
<form class="form-poll" id="poll-1225962377536" action="/cs/Satellite" target="_blank">
标识符始终以“post-”开头，然后数字是动态的。
请检查您的ID名称，“poll”和“post”非常不同。
如已回答，您可以使用querySelector：
var selectors = '[id^="poll-"]';
element = document.querySelector(selectors).id;
但是如果你一直查询“post”，querySelector将无法找到“poll”：'[id^="post-"]'
var id_list = document.querySelectorAll('[id^="image-"]')
var last_id = id_list.length
alert(last_id)
getElementsByClassName并不是完全预先构建的。如果你想让它在IE中正常工作（至少在旧版本的IE中...也许在新版本中已经修复了），那么你必须自己修补它。 - aroth