JavaScript RegEx для тегов div - PullRequest
Новая
       10

JavaScript RegEx для тегов div

5 голосов
/ 14 ноября 2008

У меня есть переменная JavaScript, которая содержит HTML-страницу, и из-за настройки мне нужно извлечь все из значений между <div id="LiveArea"> и </div> из этой переменной с помощью JavaScript.

Любая помощь очень ценится.

Ответы [ 10 ]

8 голосов
/ 19 марта 2011 
var html = "<stuff><div id=\"LiveArea\">hello stackoverflow!</div></stuff>";

var matches = html.match(/<div\s+id="LiveArea">[\S\s]*?<\/div>/gi);
var matches = matches[0].replace(/(<\/?[^>]+>)/gi, ''); // Strip HTML tags?

alert(matches);
3 голосов
/ 14 ноября 2008

Это будет невозможно только с помощью регулярного выражения , если HTML внутри этого div не содержит никаких других div. Потому что с таким шаблоном, как у Джереми, будет происходить то, что он будет соответствовать первому закрывающему тегу div, который не обязательно будет закрывающим тегом для элемента div # LiveArea.

Если у вас есть контроль над исходным HTML-кодом, вы можете вставить комментарий, который можно использовать для сопоставления, для правильного «закрытия» местоположения.

Есть и другие варианты только для javascript, но каждый из них очень хитрый или хакерский

  1. Установите значение innerHTML скрытого элемента равным этой строке содержимого, ПОТОМ потяните нужный вам innerHTML, используя решение mmattax. Но вам, вероятно, придется выполнить 2-й шаг здесь с таймаутом, чтобы дать браузеру время для оценки этого нового HTML-кода и предоставления его DOM.
  2. На самом деле анализируйте содержимое, отслеживая открытие / закрытие div, когда вы сталкиваетесь с ними, так что вы будете знать, когда вы найдете правильный тег </div>.
3 голосов
/ 14 ноября 2008

Это должно сделать это: 

pattern = /<div id="LiveArea">(.*?)<\/div>/;
matches = your_html_var.match(pattern);
the_string = matches[0];

document.write(the_string);
2 голосов
/ 14 ноября 2008 
var temp = document.createElement('DIV');
temp.innerHTML = YourVariable;
var liveArea;
for (var i = 0; i < temp.childNodes.length; i++)
{
   if (temp.childNodes[i].id == 'LiveArea')
   {
       liveArea = temp.childNodes[i];
       break;
   }
}
1 голос
/ 14 ноября 2008

Я не уверен, что следую за вами, когда вы говорите: «Переменная Javascript, которая содержит html-страницу», но если вам нужно извлечь HTML между таким div, вы можете использовать свойство innerHTML элемента. 


var e = document.getElementById('LiveArea');
if(e) alert(e.innerHTML);
0 голосов
/ 02 декабря 2014

Используйте следующее регулярное выражение: 

<div id="[^"]*">(.*?)</div>
0 голосов
/ 20 марта 2010

Пусть jQuery сделает для вас анализ: 

$(page_html).find("#LiveArea").html();
0 голосов
/ 20 марта 2010

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

Добавьте HTML-комментарий, подобный этому 

<div id="LiveArea">
<!--LiveArea-->
Content here
<!--EndLiveArea-->
</div>

Затем сопоставьте его с 

htmlVal.match(/<\!\-\-LiveArea"\-\->(.*?)<\!\-\-EndLiveArea"\-\->/);
0 голосов
/ 10 июля 2009

кажется, что javascript не поддерживает lookbehinds, что очень разочаровывает, что сделает эту проблему намного легче решить.

(?<=<div id="LiveArea">).*(?=<\/div>)

вот несколько ссылок, которые могут помочь.

хотя при обсуждении вопроса о вложенных тегах ... это было бы не в силах решения регулярных выражений, поэтому решение Джереми - лучшее, что можно сделать с помощью регулярных выражений и более того, они должны быть в одной строке ... это даже не будет совпадать, если содержимое div находится в отдельных строках, потому что для javascript нет флага 's'. Я думаю, что Питер дал ответ на этот вопрос.

0 голосов
/ 14 ноября 2008

Я нашел эту статью в Интернете, которая берет идентификатор DIV и показывает его на новой странице, чтобы распечатать; 

function getPrint(print_area)
{
//Creating new page
var pp = window.open();
//Adding HTML opening tag with <HEAD> … </HEAD> portion 
pp.document.writeln('<HTML><HEAD><title>Print Preview</title>')
pp.document.writeln('<LINK href=Styles.css type="text/css" rel="stylesheet">')
pp.document.writeln('<LINK href=PrintStyle.css ' + 
                    'type="text/css" rel="stylesheet" media="print">')
pp.document.writeln('<base target="_self"></HEAD>')

//Adding Body Tag
pp.document.writeln('<body MS_POSITIONING="GridLayout" bottomMargin="0"');
pp.document.writeln(' leftMargin="0" topMargin="0" rightMargin="0">');
//Adding form Tag
pp.document.writeln('<form method="post">');

//Creating two buttons Print and Close within a HTML table
pp.document.writeln('<TABLE width=100%><TR><TD></TD></TR><TR><TD align=right>');
pp.document.writeln('<INPUT ID="PRINT" type="button" value="Print" ');
pp.document.writeln('onclick="javascript:location.reload(true);window.print();">');
pp.document.writeln('<INPUT ID="CLOSE" type="button" ' + 
                    'value="Close" onclick="window.close();">');
pp.document.writeln('</TD></TR><TR><TD></TD></TR></TABLE>');

//Writing print area of the calling page
pp.document.writeln(document.getElementById(print_area).innerHTML);
//Ending Tag of </form>, </body> and </HTML>
pp.document.writeln('</form></body></HTML>');

}

Вы будете вызывать этот скрипт, посылая идентификатор DIV, который вы хотите получить; 

btnGet.Attributes.Add("Onclick", "getPrint('YOURDIV');")

Это сработало именно так, как я хотел. Надеюсь, это поможет

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...