Премини към съдържанието
Форумът в приложение

По-лесно сърфиране. Научи повече.

Kaldata.com - Форуми

Приложение на форума на цял екран с push известия, значки и други.

За да инсталирате това приложение на iOS и iPadOS
  1. Докоснете Иконата за споделяне в Safari
  2. Превъртете менюто и докоснете Добавяне към началния екран.
  3. Докоснете Добавяне в горния десен ъгъл.
За да инсталирате това приложение на Android
  1. Докоснете менюто с 3 точки (⋮) в горния десен ъгъл на браузъра.
  2. Докоснете Добавяне към началния екран или Инсталиране на приложение.
  3. Потвърдете, като докоснете Инсталиране.

Добре дошли!

Добре дошли в нашите форуми, пълни с полезна информация. Имате проблем с компютъра или телефона си? Публикувайте нова тема и ще намерите решение на всичките си проблеми. Общувайте свободно и открийте безброй нови приятели.

Моля, регистрирайте се за да публикувате тема и да получите пълен достъп до всички функции.

 

Парсер за html?

Featured Replies

Здравейте, искам да си направя парсер за html с JavaScript, който да показва в един елемент от страницата html код който да не се интерпретира.Искам също на този код да оцветя таговете, атрибутите им и стойностите им в три различни цвята, и точно тук ми е проблема.Аз го направих с два регулярни израза и контекстуален селектор в CSS за да спестя един регулярен израз.Искам да попитам дали има шанс да се направи всичко това само с един израз с три backreferences Ето това ми е кода като взимам html кода от външен текстови файл.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<html>

	<head>

		<title>New Document</title>

		<style type="text/css">

			#code {

				white-space: pre;

			}

			#code b {

				color: #0000FF;

			}

		</style>

		<script type="text/javascript">

			function GetCode() {

				var xmlHttp=(window.ActiveXObject) ? new ActiveXObject("Microsoft.XMLHTTP") : new XMLHttpRequest();

					if (typeof xmlHttp!='undefined') {

						xmlHttp.open("GET","html_data.txt",true);

						xmlHttp.onreadystatechange=function () {

							if (xmlHttp.readyState==4 && xmlHttp.status==200) {

								ParseHtml(xmlHttp.responseText);

							}

						}

						xmlHttp.send(null);

					}

					else {

						return

					}

			}

			function ParseHtml(data) {

				var obj=document.getElementById('code');

				var tags=/<([^>]*)>/g;

				var atribut=/(\s[^=\s]+=)("[^"]*")/g;

				data=data.replace(tags,'<b><$1></b>');

				data=data.replace(atribut,'<b style="color: red;">$1</b><b style="color: #8000FF;">$2</b>');

					obj.innerHTML=data;

			}

			window.onload=GetCode;

		</script>

	</head>

	<body>

		<div id="code">

		</div>

	</body>

</html>
html_data.txt
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<html>

   <head>

	  <title>New Document</title>

   </head>

   <body>

	  <table id="table1" cellpadding="0" cellspacing="0">

		 <tr>

			<td>text goes here 1.1</td>

		 </tr>

		 <tr>

			<td>text goes here 1.2</td>

		 </tr>

		 <tr>

			<td>text goes here 1.3</td>

		 </tr>

		 <tr>

			<td>text goes here 1.4</td>

		 </tr>

	  </table>

	  <table id="table2" cellpadding="0" cellspacing="0">

		 <tr>

			<td>text goes here 2.1</td>

		 </tr>

		 <tr>

			<td>text goes here 2.2</td>

		 </tr>

		 <tr>

			<td>text goes here 2.3</td>

		 </tr>

		 <tr>

			<td>text goes here 2.4</td>

		 </tr>

	  </table>

	  <table id="table3" cellpadding="0" cellspacing="0">

		 <tr>

			<td>text goes here 3.1</td>

		 </tr>

		 <tr>

			<td>text goes here 3.2</td>

		 </tr>

		 <tr>

			<td>text goes here 3.3</td>

		 </tr>

		 <tr>

			<td>text goes here 3.4</td>

		 </tr>

	  </table>

	  <table id="table4" cellpadding="0" cellspacing="0">

		 <tr>

			<td>text goes here 4.1</td>

		 </tr>

		 <tr>

			<td>text goes here 4.2</td>

		 </tr>

		 <tr>

			<td>text goes here 4.3</td>

		 </tr>

		 <tr>

			<td>text goes here 4.4</td>

		 </tr>

	  </table>

   </body>

</html>

Ето го и нагледно примера

Предварително благодаря на отзовалите се.

Редактирано от abozhilov (преглед на промените)

Колега - по грешни стъпки стъпваш ;) С регулярните изрази не може да се опише прозволна граматика. За това си има специални парсъри. Да се пише сериозен такъв на JavaScript си е безумие. Така че и твоя подход не е лош. Ето едно предложение от мен :

(<\/?[a-zA-Z0-9]+)(?:[ \r\n\t]+([a-zA-Z0-9]+)(="[^"]+"|='[^']+'))*([ \r\n\t]*\/?>)

Това е израз, който парсва всеки що годе правилно написан отварящ или затварящ таг. Проблема тук е че трябва да се прави обхождане и анализ на всеки от кепчърите и тогава евентуално да се извърши замяната в стринга. Забележи как се парсват атрибути - тъй като в HTML е позволено атрибутите да нямат стойност, също така стойноста може да се загради както с кавички - така и с апострофи. Обработена е и ситуацията когато тага се затваря сам. Ако ти е мерак може да напишеш алгоритъм с енумерация или да си оправиш твоите изрази. Имай пред вид, че този израз няма добре да парсне неправилно написан HTML! Не съм сигурен дали модификатора "?:" работи в JavaScript регулярните експрешъни. Ако дава проблеми махни го, но ще трябва малко да усложниш анализа.

Успех!

  • Автор

Благодаря за съветите и регулярният израз наистина има доста условности, само с едно не съм съгласен за единичните атрибути W3C препоръчват и те да имат стойности, но тук май отиваме повече към xhtml отколкото към html.За групирането без запазване в паметта работи и в JS и след малко модофициране от моя страна ми свърши работа израза.

И последно да попитам има ли някъде сайт или програма с която да си тествам бързината на регулярните изрази които пиша?

Благодаря за съветите и регулярният израз наистина има доста условности, само с едно не съм съгласен за единичните атрибути W3C препоръчват и те да имат стойности, но тук май отиваме повече към xhtml отколкото към html.За групирането без запазване в паметта работи и в JS и след малко модофициране от моя страна ми свърши работа израза.

И последно да попитам има ли някъде сайт или програма с която да си тествам бързината на регулярните изрази които пиша?

Те от W3C могат да си препоръчват каквото искат. Важното е ти да се защитиш от евенуални грешки. Никой не ти гарантира, че в парсъра ще попадне само валиден HTML или XHTML, докато браузърите парсват и показват всякоя бълвоч, ще има и грешен код. Мене ако питаш, даже израза може да се подсили още малко, но ще те оставя да се наловчиш сам. Ето ти и фрий програмка за регулярни изрази.

Успех!

Добавете отговор

Можете да публикувате отговор сега и да се регистрирате по-късно. Ако имате регистрация, влезте в профила си за да публикувате от него.

Гост
Публикацията ви съдържа термини, които не допускаме! Моля, редактирайте съдържанието си и премахнете подчертаните думи по-долу. Ако замените букви от думата със звездички или друго, за да заобиколите това предупреждение, профилът ви ще бъде блокиран и наказан!
Напишете отговор в тази тема...

Разглеждащи това в момента 0

  • Няма регистрирани потребители разглеждащи тази страница.

Дарение

  • Подкрепи съществуването на форума - направи дарение
    26%
    Дарени 256.00 EUR от нужните 1,000.00 EUR

Бюлетин

Получавайте известие, когато има важна промяна или новина свързана с форума.

Профил

Навигация

Търсене

Търсене

Конфигуриране на push известия в браузъра

Chrome (Android)
  1. Докоснете иконата на катинар до адресната лента.
  2. Докоснете Разрешения → Известия.
  3. Променете предпочитанията си.
Chrome (Desktop)
  1. Кликнете върху иконата на катинар в адресната лента.
  2. Изберете Настройки на сайта.
  3. Намерете Известия и коригирайте предпочитанията си.