Получить элемент по идентификатору с помощью регулярного выражения

Question

У меня был быстрый вопрос относительно RegEx ...

У меня есть строка , которая выглядит примерно так:

"This was written by <p id="auth">John Doe</p> today!"

То, что я хочу сделать (с помощью javascript), - это извлечь «John Doe» из любого тега с идентификатором «auth».

Может ли кто-нибудь пролить свет? Прошу прощения за вопрос.

Полная история: Я использую парсер XML для передачи данных в переменные из канала. Однако в XML-документе есть один тег (), содержащий HTML, переданный в строку. Это выглядит примерно так:

 <item>
  <title>This is a title</title>
  <description>
  "By <p id="auth">John Doe</p> text text text... so on"
  </description>
 </item>

Итак, как вы можете видеть, я не могу использовать анализатор HTML / XML для этого тега p, потому что он находится в строке, а не в документе.

Answer 1

Вот способ заставить браузер выполнить для вас разбор HTML:

var string = "This was written by <p id=\"auth\">John Doe</p> today!";

var div = document.createElement("div");

div.innerHTML = string; // get the browser to parse the html

var children = div.getElementsByTagName("*");

for (var i = 0; i < children.length; i++)
{
    if (children[i].id == "auth")
    {
        alert(children[i].textContent);
    }
}

Если вы используете библиотеку, например jQuery, вы можете скрыть цикл for и заменить использование textContentчто-то кросс-браузерное.

Answer 2

Для этого не нужно регулярных выражений. Вместо этого используйте DOM.

var obj = document.getElementById('auth');
if (obj)
{
    alert(obj.innerHTML);
}

Кстати, умножение id с одинаковым значением на одной странице недопустимо (и, несомненно, приведет к странному поведению JS).

Если вы хотите, чтобы на одной странице было много auth, используйте class вместо id. Тогда вы можете использовать что-то вроде:

//IIRC getElementsByClassName is new in FF3 you might consider using JQuery to do so in a more "portable" way but you get the idea...
var objs = document.getElementsByClassName('auth');
if (objs)
{
    for (var i = 0; i < objs.length; i++)
        alert(obj[i].innerHTML);
}

РЕДАКТИРОВАТЬ: Поскольку вы хотите проанализировать строку, содержащую некоторый HTML, вы не сможете использовать мой ответ как-iis. Будет ли ваша HTML-строка содержать весь HTML-документ? Какая-то часть? Действительный HTML? Частичный (неработающий) HTML?

Answer 3

Предполагая, что у вас есть только 1 auth на строку, вы можете пойти примерно так:

var str = "This was written by <p id=\"auth\">John Doe</p> today!",
    p = str.split('<p id="auth">'),
    q = p[1].split('</p>'),
    a = q[0];
alert(a);

Достаточно просто.Разделите вашу строку на ваш абзац, затем разбейте вторую часть на закрытии абзаца, и первая часть результата будет вашим значением.Каждый раз.

Answer 4

Если содержимое тега содержит только текст, вы можете использовать это:

function getText (htmlStr, id) {
  return new RegExp ("<[^>]+\\sid\\s*=\\s*([\"'])"
    + id 
    + "\\1[^>]*>([^<]*)<"
  ).exec (htmlStr) [2];
}


var htmlStr = "This was written by <p id=\"auth\">John Doe</p> today!";
var id = "auth";
var text = getText (htmlStr, id);
alert (text === "John Doe");

Answer 5

То, что я хочу сделать (с помощью JavaScript), это в основном извлечь "Джон Доу" из любого тега с идентификатором «auth».

Вы не можете иметь одинаковые id (auth) для более чем одного элемента. Идентификатор должен назначаться один раз для каждого элемента на странице.

Если, однако, вы назначаете класс auth для элементов, вы можете сделать что-то вроде этого, предполагая, что мы имеем дело с элементами абзаца:

// find all paragraphs
var elms = document.getElementsByTagName('p');

for(var i = 0; i < elms.length; i++)
{
  // find elements with class auth
  if (elms[i].getAttribute('class') === 'auth') {
    var el = elms[i];

    // see if any paragraph contains the string
    if (el.innerHTML.indexOf('John Doe') != -1) {
      alert('Found ' + el.innerHTML);
    }
  }
}

Answer 6

Возможно что-то вроде

document.getElementById("auth").innerHTML.replace(/<^[^>]+>/g, '')

может работать. innerHTML поддерживается во всех современных браузерах. (Вы можете пропустить замену, если не хотите удалять биты HTML из внутреннего содержимого.)

Если у вас есть jQuery, просто наберите

$("#auth").text()