Ich brauche die ID eines Elements, aber der Wert ist dynamisch, nur der Anfang ist immer derselbe.
Hier ist ein Ausschnitt des Codes.
<form class="form-poll" id="poll-1225962377536" action="/cs/Satellite">
Die ID beginnt immer mit 'poll-', dann sind die Zahlen dynamisch.
Wie erhalte ich die ID nur mit JavaScript und nicht mit jQuery?
Sie kann verwenden der querySelector dafür
document.querySelector('[id^="poll-"]').id;
Der Selektor bedeutet: Holen Sie sich ein Element, bei dem das Attribut [id]
mit der Zeichenfolge "poll-"
beginnt.
^
stimmt mit dem Start überein*
stimmt mit jeder Position überein$
stimmt mit dem Ende überein
Versuche dies.
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;
}
Beispiel für HTML-Markup.
<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>
Nenne es wie
var postedOnes = getElementsByIdStartsWith("posts", "div", "post-");
Demo hier: http://jsfiddle.net/naveen/P4cFu/
In Anbetracht dessen, dass Sie die vollständige ID des Elements nur anhand des Präfixes ermitteln möchten, müssen Sie das gesamte DOM durchsuchen (oder zumindest die Suche nach einer gesamten Unterstruktur, wenn Sie einige kennen Element, das garantiert immer Ihr Zielelement enthält). Sie können dies mit so etwas tun:
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;
}
}
};
Hier ist ein Beispiel: http://jsfiddle.net/xwqKh/
Beachten Sie, dass dynamische Element-IDs wie die, mit denen Sie gerade arbeiten, normalerweise verwendet werden, um die Eindeutigkeit der Element-IDs auf einer einzelnen Seite zu gewährleisten. Das bedeutet, dass es wahrscheinlich ist, dass es mehrere Elemente gibt, die dasselbe Präfix verwenden. Wahrscheinlich möchten Sie sie alle finden.
Wenn Sie alle Elemente mit einem bestimmten Präfix anstelle des ersten finden möchten, können Sie etwas verwenden, was hier gezeigt wird: http://jsfiddle.net/xwqKh/1/
Ich bin nicht ganz sicher, ob ich weiß, wonach Sie fragen, aber Sie können String-Funktionen verwenden, um die tatsächliche ID zu erstellen, nach der Sie suchen.
var base = "common";
var num = 3;
var o = document.getElementById(base + num); // will find id="common3"
Wenn Sie die tatsächliche ID nicht kennen, können Sie das Objekt mit getElementById nicht nachschlagen. Sie müssen es auf eine andere Weise finden (nach Klassenname, nach Tag-Typ, nach Attribut, nach übergeordnetem Element, nach untergeordnetem Element). usw...).
Nachdem Sie uns nun endlich etwas von HTML gegeben haben, können Sie mit diesem einfachen JS alle Formularelemente suchen, deren ID mit "poll-" beginnt:
// 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);
}
<form class="form-poll" id="poll-1225962377536" action="/cs/Satellite" target="_blank">
Die ID beginnt immer mit 'post-', dann sind die Zahlen dynamisch.
Bitte überprüfen Sie Ihre ID-Namen. "Poll" und "post" sind sehr unterschiedlich.
Wie bereits beantwortet, können Sie querySelector verwenden:
var selectors = '[id^="poll-"]';
element = document.querySelector(selectors).id;
querySelector findet jedoch nicht "poll", wenn Sie ständig nach "post" fragen: '[id^="post-"]'
Sie müssen ihm wahrscheinlich entweder eine konstante Klasse geben und getElementsByClassName
aufrufen, oder einfach getElementsByTagName
verwenden und Ihre Ergebnisse durchlaufen und den Namen überprüfen.
Ich würde vorschlagen, Ihr zugrunde liegendes Problem zu betrachten und herauszufinden, wie Sie die ID im Voraus kennen.
Wenn Sie etwas mehr darüber erfahren, warum Sie dies erhalten, könnten wir eine bessere Alternative finden.
Sie verwenden die id
-Eigenschaft, um die ID abzurufen, dann die substr
-Methode, um den ersten Teil davon zu entfernen, und dann optional parseInt
, um daraus eine Zahl zu machen:
var id = theElement.id.substr(5);
oder:
var id = parseInt(theElement.id.substr(5));