Подтвердить что ты не робот

База данных javascript getElementById на частичной строке

Мне нужно получить идентификатор элемента, но значение является динамическим, и только его начало всегда одинаково.

Вот фрагмент кода.

<form class="form-poll" id="poll-1225962377536" action="/cs/Satellite">

Идентификатор всегда начинается с "poll-", тогда числа являются динамическими.

Как я могу получить идентификатор, используя только JavaScript, а не jQuery?

4b9b3361

Ответ 1

Для этого вы можете использовать querySelector :

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

Селектор означает: получить элемент, в котором атрибут [id] начинается со строки "poll-".

^ соответствует началу
* соответствует любой позиции
$ соответствует концу

jsfiddle

Ответ 2

Попробуйте это.

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-");

Демо здесь: http://jsfiddle.net/naveen/P4cFu/

Ответ 3

Учитывая, что вы хотите определить полный идентификатор элемента на основе только префикса, вам придется выполнять поиск всей 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;
        }
    }
};

Вот пример: http://jsfiddle.net/xwqKh/

Имейте в виду, что идентификаторы динамических элементов, такие как те, с которыми вы работаете, обычно используются, чтобы гарантировать уникальность идентификаторов элементов на одной странице. Это означает, что существует множество элементов, которые имеют один и тот же префикс. Наверное, вы хотите найти их всех.

Если вы хотите найти все элементы, которые имеют данный префикс, а не только первый, вы можете использовать что-то вроде того, что показано здесь: http://jsfiddle.net/xwqKh/1/

Ответ 4

Я не совсем уверен, что знаю, о чем вы просите, но вы можете использовать строковые функции для создания фактического идентификатора, который вы ищете.

var base = "common";
var num = 3;

var o = document.getElementById(base + num);  // will find id="common3"

Если вы не знаете фактический идентификатор, то вы не можете искать объект с помощью getElementById, вам придется найти его другим способом (по имени класса, по типу тега, по атрибуту, родительскому, от ребенка и т.д.).

Теперь, когда вы наконец дали нам некоторые из HTML, вы можете использовать этот простой JS, чтобы найти все элементы формы, у которых есть идентификатор, который начинается с "poll -":

// 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);
}

Ответ 5

Вам, вероятно, придется либо дать ему постоянный класс, либо позвонить getElementsByClassName, либо просто использовать getElementsByTagName, и просмотреть результаты, проверив имя.

Я предлагаю взглянуть на вашу основную проблему и выяснить способ, которым вы можете заранее знать идентификатор.

Возможно, если вы разместите немного больше о том, почему вы это получили, мы могли бы найти лучшую альтернативу.

Ответ 6

Вы используете свойство id для получения идентификатора, затем метод substr для удаления первой части, затем необязательно parseInt, чтобы превратить его в число:

var id = theElement.id.substr(5);

или

var id = parseInt(theElement.id.substr(5));

Ответ 7

<form class="form-poll" id="poll-1225962377536" action="/cs/Satellite" target="_blank">

Идентификатор всегда начинается с "post-", тогда числа являются динамическими.

Пожалуйста, проверьте свои имена, "опрос" и "пост" очень разные.

Как уже было сказано, вы можете использовать querySelector:

var selectors = '[id^="poll-"]';
element = document.querySelector(selectors).id;

но querySelector не найдет "опрос", если вы продолжаете запрашивать "post": '[id^="post-"]'