Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > JavaScript: Общие вопросы > Рег. выражение - поиск html тега


Автор: gorden 23.1.2008, 13:03
Привет!

Помогите пожалуйста с рег. выражением. Я вытаскиваю содержимое DIVа с помощью innerHTML. В этом содержимом есть такой тег:

Код

<input type="hidden" id="myid" value="myvalue">


Различные браузеры могут его так-же интерпритировать как:

Код

<input id="myid" type="hidden" value="myvalue">


или 

Код

<input value="myvalue" id="myid" type="hidden">


или 

Код

<input value=myvalue id=myid type=hidden>


т.е. удалять кавычки или менять элементы местами или добавлять обратный слеш в конце тега, например:

Код

<input value="myvalue" id="myid" type="hidden"/>


Мне нужно с помощью регулярного выражения найти этот тег из полученного содержимого DIVa. 

значение value - может быть буквой или цифрой
значение id - может быть может быть буквой или цифрой или _


У меня на ум приходит только следующее, но это не работает:
Код

var reg = '<input (id=([\'"]?)([_0-9a-zA-Z]?)([\'"]?))|(type=([\'"]?)hidden([\'"]?))|(value=([\'"]?)([0-9a-zA-Z]?)([\'"]?))>';




Буду очень благодарен за любой совет. Спасибо!!!!!!

Автор: solenko 23.1.2008, 13:14
А может проще пробежаться по DOM дереву и найти этот элемент?

Автор: Sardar 23.1.2008, 13:22
Что только народ не придумает...  smile 
div.http://developer.mozilla.org/en/docs/DOM:element.getElementsByTagName("input")[0] - оно?

Автор: ksnk 23.1.2008, 15:23
Sardar, В этом случае, скорее всего, даже getElementById подойдет ;-)...

Автор: gorden 23.1.2008, 15:50
Спасибо, я прекрасно понимаю, что через getElementById это можно сделать. Но в моем случае необходимо сделать именно через рег. выражения, иначе я бы не спрашивал.

Автор: Astraller 23.1.2008, 15:57
gorden, а может вы еще не поленитесь изложить почему? smile

Автор: gorden 23.1.2008, 16:21
Ну вот смотрите:

Код

<div id="container" align="center"> 
<a href="http://www.mysite.com/">MySite</a>
<input type="hidden" id="myid" value="myvalue">
<script src="http://www.mysite.com/myscript.js" language="javascript" type="text/javascript"></script>
Text... Text... Text... 

<a href="http://www.mysite2.com/" class="myclass">MySite2</a>
Еще текст
</div>



Этот код, например, будет размещаться на разных сайтах. При этом, подключаемый "myscript.js", берет содержимое DIVa при помощи innerHTML и проверяет, не внесены ли какие-либо ненужные изменения в содержимое DIVa "container". В DIVе могут находится и теги и Текст и все что угодно. Подключаемый скрипт "myscript.js" проверяет это, и если нет ненужных изменений, то выполняет одно действие, а если есть - другое.

Вот мне и нужно это все проверить. Как в этом случае через DOM работать я пока не представляю. У меня пока получается проверить текст, с учетом случайных пробелов и переводов строки, которые допустимы для текста, но теги с более чем одним атрибутом проверить пока не получается.

Автор: ksnk 23.1.2008, 17:27
Цитата(gorden @  23.1.2008,  16:21 Найти цитируемый пост)
Как в этом случае через DOM работать я пока не представляю.
 В тот момент, когда скрипт "берет содержимое DIVa при помощи innerHTML" этот самый div УЖЕ есть в DOM и его и его содержимое можно проверить самим DOM'ом.

Код

var container=documet.getElementById('container'),
      input=container.getElementById('myid');

if(input.value!='simple value') alert('Спасите, Грабят!!!');      

if(input.onclick) alert('Оппа! Грязный код...');      



Тут есть тонкость - браузеры могут навесить свои собственные атрибуты на тег без разрешения, так что проверять надо только самые "ходовые" smile

Автор: gorden 24.1.2008, 17:49
Цитата

Код

var container=document.getElementById('container'); 
      input=container.getElementById('myid');


Не работает у меня ни в одном браузере такая конструкция. Не выходит этот код на mydiv.


Так тоже не работает:
Код

var container=document.getElementById('container').innerHTML; 
      input=container.getElementById('myid');


Хорошо, если через DOM, хотя в этом случае не проверить содержимое текста, то как тогда правильно обратиться к mydiv, толко не через главный документ: document.getElementById('mydiv') а через 'container'?

И все же если есть мысли по поводу рег. выражений, pls. подскажите.

Автор: Sardar 24.1.2008, 18:07
Цитата(gorden @  24.1.2008,  16:49 Найти цитируемый пост)
Не работает у меня ни в одном браузере такая конструкция.

Этого не может быть, если только скрипт не пытается исполниться до вёрстки <div id="container...

Цитата(gorden @  24.1.2008,  16:49 Найти цитируемый пост)
Так тоже не работает:

innerHTML - строка, выборок как коллекция не поддерживает. getElementById метод документа, потому как id уникален во всём документе (если вёрстка валидна), следовательно реализовать его для контейнерных элементов не имеет смысла.

Цитата(gorden @  23.1.2008,  12:03 Найти цитируемый пост)
Я вытаскиваю содержимое DIVа с помощью innerHTML.

Вот в этой точке вместо выдёргивания innerHTML поставь div.getElementsByTagName("input") - список всех input'ов внутри div'а. Да, div это твоя переменная, где раньше стоял div.innerHTML...  Да, getElementsByTagName пишеться с s (множественное). Вроде бы больше нигде ошибиться нельзя...

Регами не стоит, это как минимум глупо. Если всё же очень хочется, то не нужно вносить атрибуты в рег, просто захвати все:
Код

((?:(?:[a-zA-Z0-9_]+)\s*=\s*(?:"(?:[^\\"]|\\.)*")|(?:'(?:[^\\"]|\\.)*')|(?:[^\s]*))*)
//да, это общий рег, продублируй все \
//да, это часть отвечает только за аргументы
//да, это писалось на коленке и без тестов :)



P.S. при проблемах, отвечай с ссылкой на страницу, иначе долго гадать будем.

Автор: gorden 24.1.2008, 19:31
Цитата

Этого не может быть, если только скрипт не пытается исполниться до вёрстки <div id="container...


Никак не пойму. Все равно не работает. Перегрелся я что-ли? Ошибка: container.getElementById is not a function


Код

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>

<body>


<div id="container">
<input id="myid" type="hidden" value="OK">
<script language="javascript" type="text/javascript">
  function getInputElementValue(){
     var container = document.getElementById("container");
     return container.getElementById("myid").value;
  }
</script>
</div>

<input type="button" value="test" onclick="alert(getInputElementValue())">

</body>
</html>

Автор: Sardar 24.1.2008, 19:43
gorden, повторяю, id - уникальный идентификатор на странице. Уникальный - означает один единственный, второго быть не может, иначе будет ошибка (браузер проигнорирует их множество, выдаст произвольный). Вывод: getElementById не имеет смысла вкладывать вне документа, т.к. иерархии (дерева) быть не может.

Решение: return document.getElementById("myid").value;

В отличии от id, имя тега не уникально (естественно), т.е. можно взять все теги с определённым именем из некоторого контейнера. Для этого метод (любой контейнер или document).getElementsByTagName(name). Возвращает список всех найденных, выбираешь необходимый.

Автор: gorden 24.1.2008, 20:39
Я понял теперь. Спасибо. Буду пробовать одновременно и через DOM (для тегов) и через RegEx (для текста внутри контейнера).

THANKS!!!!!!!!!!!!!!

Автор: gorden 28.1.2008, 15:59
Снова возвращаюсь к теме, т.к. возникла еще одно проблема. Вот имеем:

Код

var tagDiv = container.getElementsByTagName('div');
var styleContent = tagDiv[0].attributes['style'].value;


В данном случае в контейнере только один DIV. У этого DIVа есть атрибут style со значением. Во всех браузерах кроме IE переменная styleContent получает точное значение атрибута style, а IE почему присваивает ей null.

Подскажите pls. в чем проблема
Спасибо.

Автор: Astraller 28.1.2008, 16:22
Можно попробовать:
Код

var styleContent = tagDiv[0].getAttribute('style');

Или просто:
Код

var styleContent = tagDiv[0].style;


У меня, помнится работало и то и другое везде. smile 

Автор: gorden 28.1.2008, 16:29
Цитата(Astraller @  28.1.2008,  16:22 Найти цитируемый пост)
var styleContent = tagDiv[0].getAttribute('style');

Не получается. Возвращается обьект. А если так:

Код

var styleContent = tagDiv[0].getAttribute('style').value;


То IE возвращает undefined.

Автор: Astraller 28.1.2008, 16:37
gorden, а если:
Код

alert(tagDiv[0].style);

Автор: SelenIT 28.1.2008, 16:39
Ох уж этот IE с его http://xpoint.ru/know-how/JavaScript/Atributyi?8 атрибутов...

По идее, везде должен работать tagDiv[0].style.cssText.

Автор: gorden 28.1.2008, 16:55
Цитата(SelenIT @  28.1.2008,  16:39 Найти цитируемый пост)
По идее, везде должен работать tagDiv[0].style.cssText. 


Точно! Работает! Но только теперь везде кроме Оперы :(

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)