Ich muss die ID eines Elements abrufen, aber der Wert ist dynamisch, nur der Anfang ist immer der gleiche.
Hier ist ein Ausschnitt aus dem Code.
<form class="form-poll" id="poll-1225962377536" action="/cs/Satellite">
Die ID beginnt immer mit, poll-
dann sind die Zahlen dynamisch.
Wie kann ich die ID nur mit JavaScript und nicht mit jQuery abrufen?
javascript
getelementbyid
Calebo
quelle
quelle
getElementsByClassName
ist nicht ganz vorgefertigt. Wenn Sie möchten, dass es im IE korrekt funktioniert (zumindest ältere Versionen des IE ... möglicherweise wurde es in neueren Versionen behoben), müssen Sie es selbst patchen.Antworten:
Sie können den querySelector dafür verwenden:
document.querySelector('[id^="poll-"]').id;
Der Selektor bedeutet: Holen Sie sich ein Element, bei dem das Attribut
[id]
mit der Zeichenfolge beginnt"poll-"
.^
entspricht dem Start*
entspricht jeder Position$
entspricht dem Endejsfiddle
quelle
querySelectorAll
ist toll. Außerdocument.querySelectorAll('[id^="poll-"]')
gibt eine Liste zurück. Wir müssen die Liste iterieren, um die IDs zu erhalten, anstatt sie zu verwendendocument.querySelectorAll('[id^="poll-"]').id
.^
entspricht dem Start,$
dem Ende und*
jeder Position. In deinem Fall wäre esid$="dynamic_constant"
.[id^=user-][id$=-image]
:)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 ein 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>
Nennen wir es wie
var postedOnes = getElementsByIdStartsWith("posts", "div", "post-");
Demo hier: http://jsfiddle.net/naveen/P4cFu/
quelle
Wenn Sie die vollständige ID des Elements nur anhand des Präfixes ermitteln möchten, müssen Sie das gesamte DOM durchsuchen (oder zumindest einen gesamten Teilbaum durchsuchen, wenn Sie einige kennen Element, das garantiert immer Ihr Zielelement enthält). Sie können dies mit etwas tun wie:
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 arbeiten, normalerweise verwendet werden, um die Eindeutigkeit von Element-IDs auf einer einzelnen Seite zu gewährleisten. Dies bedeutet, dass es wahrscheinlich mehrere Elemente gibt, die dasselbe Präfix haben. 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 Folgendes verwenden : http://jsfiddle.net/xwqKh/1/
quelle
querySelectorAll
mit moderner Aufzählungpolls = document.querySelectorAll('[id ^= "poll-"]'); Array.prototype.forEach.call(polls, callback); function callback(element, iterator) { console.log(iterator, element.id); }
In der ersten Zeile werden alle Elemente ausgewählt, die
id
mit der Zeichenfolge beginnenpoll-
. Die zweite Zeile ruft die Aufzählung und eine Rückruffunktion hervor.quelle
Ich bin nicht ganz sicher, ob ich weiß, wonach Sie fragen, aber Sie können Zeichenfolgenfunktionen 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 nicht mit getElementById nachschlagen. Sie müssen es auf andere Weise finden (nach Klassenname, Tag-Typ, Attribut, Eltern, Kind, etc...).
Nachdem Sie uns endlich einen Teil des HTML-Codes gegeben haben, können Sie mit diesem einfachen JS alle Formularelemente finden, 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); }
quelle
Sie müssen ihm wahrscheinlich entweder eine konstante Klasse geben und anrufen
getElementsByClassName
oder ihn einfach verwendengetElementsByTagName
und Ihre Ergebnisse durchlaufen und den Namen überprüfen.Ich würde vorschlagen, dass Sie sich Ihr zugrunde liegendes Problem ansehen und einen Weg finden, wie Sie die ID im Voraus kennen.
Vielleicht könnten wir eine bessere Alternative finden, wenn Sie etwas mehr darüber posten, warum Sie dies erhalten.
quelle
Sie verwenden die
id
Eigenschaft, um die ID abzurufen, dann diesubstr
Methode, um den ersten Teil davon zu entfernen, und optionalparseInt
, um ihn in eine Zahl umzuwandeln:var id = theElement.id.substr(5);
oder:
var id = parseInt(theElement.id.substr(5));
quelle
<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, "Umfrage" und "Post" sind sehr unterschiedlich.
Wie bereits beantwortet, können Sie querySelector verwenden:
var selectors = '[id^="poll-"]'; element = document.querySelector(selectors).id;
Aber querySelector findet "poll" nicht, wenn Sie weiterhin nach "post" fragen:
'[id^="post-"]'
quelle