<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Уроки PHP, Mootools, JavaScript, ActionScript, HTML, CSS &#187; строка</title>
	<atom:link href="http://php.infoniac.ru/tag/%d1%81%d1%82%d1%80%d0%be%d0%ba%d0%b0/feed/" rel="self" type="application/rss+xml" />
	<link>http://php.infoniac.ru</link>
	<description>Уроки программирования от новичка новичкам</description>
	<lastBuildDate>Tue, 20 Mar 2012 18:36:33 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>«Фильтруй базар» или учимся фильтровать текст – Уроки Mootools – Урок 9</title>
		<link>http://php.infoniac.ru/text-filtering-mootorial9.html</link>
		<comments>http://php.infoniac.ru/text-filtering-mootorial9.html#comments</comments>
		<pubDate>Mon, 16 Nov 2009 13:07:15 +0000</pubDate>
		<dc:creator>proglammer</dc:creator>
				<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[Mootools]]></category>
		<category><![CDATA[Уроки новичка]]></category>
		<category><![CDATA[обработка текста]]></category>
		<category><![CDATA[строка]]></category>
		<category><![CDATA[текст]]></category>
		<category><![CDATA[уроки]]></category>

		<guid isPermaLink="false">http://php.infoniac.ru/?p=562</guid>
		<description><![CDATA[В продолжении урока №9 о фильтрации чисел, продолжим в том же духе: расмотрим уструменты, посволяющие фильтровать текст. Как говорилось и в 9-м уроке, инструментами Mootools можно осуществлять превентивные действия по обороне сайта от атак и ошибок при вводе данных, однако, ключевое слово тут "превентивные" - ВСЕ Javascript инструменты можно использовать как оружие первой линии обороны, но полноценно оборняться и огрождаться от ошибок ввода нужно сервеными инструментами! А пока, нырнем в фильтрацию с помощью Mootools.]]></description>
			<content:encoded><![CDATA[<!-- google_ad_section_start --><div style="text-align:center;width:100%;margin:10px 0px 10px 0px;"><div style="margin:auto;"><script type="text/javascript"><!--
google_ad_client = "pub-8205915997794532";
/* 728x90, создано 08.12.10 */
google_ad_slot = "3730215141";
google_ad_width = 728;
google_ad_height = 90;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script></div></div><div style="width:100%;min-width:100%;"><p>Привет, люди планеты Земля! 1) хочу перед всеми извинится, если это кому-либо важно, за много месяxный перерыв… Мне стыдно!!!! Сам не ожидал, что так получится, но свадьба – дело тонкое, трудоемкое, которое требует много времени. Да, я женился, отдохнул, и готов к новым урокам. Еще, в качестве оправдания хочу сказать, что все это время я не забывал о блоге, своем не развитом, и хотя бы записывал идеи постов, которые, как мне кажется, окажутся полезными. Некоторые темы уже даже наполовину готовы, осталось только их дописать и опубликовать – всего ничего! Ну а пока, внимание! Смотрим на доску!</p>
<p>Если кто не заметил, я перешел от вручную написанного моим знакомым программистом движка на более популярный вордпрес. Это не означает, что ЦМСка моего знакомого не хороша – наоборот, она хороша тем, что она заточена под определенные действия, а именно под продвижение. Но, так как эту систему управления написал не я, я в ней совсем не разбираюсь, а дергать человека постоянно не хочу, решил перейти на вордпрес. Благо, по этой тематике в интернете много всего понаписано, да и просто покопаться в коде вордпреса тоже полезно для развития. Итак, все старые посты перекинуты, теперь все по-прежнему. Продолжаю публиковать уроки Mootools. Вот он следующий урок, о фильтрации текста.</p>
<span id="more-562"></span>
<h2>Функции обработки строк</h2>
<p>В этом уроке поговорим о том, какие возможности нам предоставляет библиотека Mootools при работе с данными в виде строк. Сразу нужно отметить, что то, что будет показано в этом уроке – это лишь ничтожная часть того, что Mootools может предоставить для работы со строками. В качестве небольшой иллюстрации можно привести функцию <strong>сamelCase()</strong>, которая переделывает текст <em>такого-типа</em> в текст <em>ТакогоТипа</em> (или любую другую функцию обработки текста, основанную на регулярных выражениях). Итак, в этом уроке мы пробежимся по основам работы с текстовыми строками, а потом углубимся дальше.</p>
<p>Перед тем, как мы продолжим, взглянем на то, как такие функции вызываются:</p>


<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #003366; font-weight: bold;">var</span> my_text_variable <span style="color: #339933;">=</span> <span style="color: #3366CC;">&quot;Сюда вставляем текстовую строку&quot;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #006600; font-style: italic;">//  результат переменная с исходником.наименование функции</span>
<span style="color: #003366; font-weight: bold;">var</span> result_of_function <span style="color: #339933;">=</span> my_text_variable.<span style="color: #660066;">someStringFunction</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></div></div>



<p>Только ради большей эрудиции, следует отметить, что строковые функции можно вызывать и непосредственно с исходником:</p>


<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #003366; font-weight: bold;">var</span> result_of_function <span style="color: #339933;">=</span> <span style="color: #3366CC;">&quot;Сюда вставляем текст&quot;</span>.<span style="color: #660066;">someStringFunction</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></div></div>



<p>Обратите внимание, что так же можно вызвать и функцию для обработки числа:</p>


<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #006600; font-style: italic;">//Обратите внимание на использование скобок</span>
&nbsp;
<span style="color: #006600; font-style: italic;">//тогда как при работе со строками используются кавычки</span>
<span style="color: #003366; font-weight: bold;">var</span> limited_number <span style="color: #339933;">=</span> <span style="color: #009900;">&#40;</span><span style="color: #CC0000;">256</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">limit</span><span style="color: #009900;">&#40;</span><span style="color: #CC0000;">1</span><span style="color: #339933;">,</span> <span style="color: #CC0000;">100</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></div></div>



<p>Также, хочет отметить вот что: Ява скрипты не должны вычищать пользовательский текст перед посылкой его на сервер для дальнейшей обработки. Все, что пишится на JavaScript может быть видно ВСЕМ посетителям страницы, эти скрипты можно включать/выключать, потому настоятельно рекоммендую не использовать JavaScript для обеспечения безопасности. Надеюсь не забуду провести небольшой дискурс по поводу безопасности с помощью PHP, когда мы дойдем до класса Mootools Request. И еще раз – все скрипты обеспечивающие безопасность должны выполняться на сервере, подальше от пользователя, а не с помощью JavaScript и всего к нему относящемуся!!!</p>
<h3>trim()</h3>
<p>Функция <strong>trim()</strong> позволяет, как и в языке PHP, быстро и эффективно избавить строку от лишних пробелов и пустого пространсва по обеим сторонам.</p>


<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #006600; font-style: italic;">//Текст, который мы &quot;тримируем&quot;</span>
<span style="color: #003366; font-weight: bold;">var</span> text_to_trim <span style="color: #339933;">=</span>  <span style="color: #3366CC;">&quot;    <span style="color: #000099; font-weight: bold;">\n</span>Строка с ненужным пустым местом     &quot;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #006600; font-style: italic;">//  переменная trimmed_text стала такой: &quot;Строка с ненужным пустым местом&quot;</span>
<span style="color: #003366; font-weight: bold;">var</span> trimmed_text <span style="color: #339933;">=</span> text_to_trim.<span style="color: #660066;">trim</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></div></div>



<p>Если  вы еще не сталкивались с таким символом, как &#8220;\n&#8221;, сообщаю, что этот символ соответствует новой строке (от англ. &#8220;<em>Newline</em>&#8220;). Этот символ можно использовать в тексте, который нужно разбить на строки. Такой символ, или разрыв строк, фунцией <strong>trim()</strong> считается как пустое пространство, потому от него функция тоже избавляется. Жаль только, что <strong>trim()</strong> не избавляет от пустого пространства внутри текста:</p>


<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #003366; font-weight: bold;">var</span> trimDemo <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
	<span style="color: #006600; font-style: italic;">//дадим тексту переменную</span>
&nbsp;
	<span style="color: #003366; font-weight: bold;">var</span> text_to_trim <span style="color: #339933;">=</span>  <span style="color: #3366CC;">'            <span style="color: #000099; font-weight: bold;">\n</span>очень       много       белого<span style="color: #000099; font-weight: bold;">\n</span>              '</span><span style="color: #339933;">;</span>
<span style="color: #339933;">&amp;</span>nbsp<span style="color: #339933;">;</span>
	<span style="color: #006600; font-style: italic;">//тримируем</span>
&nbsp;
	<span style="color: #003366; font-weight: bold;">var</span> trimmed_text <span style="color: #339933;">=</span> text_to_trim.<span style="color: #660066;">trim</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #339933;">&amp;</span>nbsp<span style="color: #339933;">;</span>
	<span style="color: #006600; font-style: italic;">//Смотрим результат</span>
	<span style="color: #000066;">alert</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'До тримирования: <span style="color: #000099; font-weight: bold;">\n</span>'</span> <span style="color: #339933;">+</span> 
		  <span style="color: #3366CC;">'|-'</span> <span style="color: #339933;">+</span> text_to_trim <span style="color: #339933;">+</span> <span style="color: #3366CC;">'-|<span style="color: #000099; font-weight: bold;">\n</span><span style="color: #000099; font-weight: bold;">\n</span>'</span> <span style="color: #339933;">+</span>
&nbsp;
		  <span style="color: #3366CC;">'После тримирования : <span style="color: #000099; font-weight: bold;">\n</span>'</span> <span style="color: #339933;">+</span>  
	      <span style="color: #3366CC;">'|-'</span> <span style="color: #339933;">+</span> trimmed_text <span style="color: #339933;">+</span> <span style="color: #3366CC;">'-|'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span></pre></div></div>



<p>
  <button id="trim">Тримирование</button>
</p>
<h3>clean()</h3>
<p>Понятно, заваливать весь текст пробелами – нехорошо. Потому, разработчики Mootools пошли навстречу тем, кто так считает. Функция <strong>clean()</strong> очистит не только пробелы и «пробело-образные» символы до и после текста, но и внутри него:</p>


<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #006600; font-style: italic;">//Текст для очистки</span>
<span style="color: #003366; font-weight: bold;">var</span> text_to_clean <span style="color: #339933;">=</span>  <span style="color: #3366CC;">&quot;    <span style="color: #000099; font-weight: bold;">\n</span>Текст     <span style="color: #000099; font-weight: bold;">\n</span>с      большим <span style="color: #000099; font-weight: bold;">\n</span> <span style="color: #000099; font-weight: bold;">\n</span>    количеством     <span style="color: #000099; font-weight: bold;">\n</span>пробелов  <span style="color: #000099; font-weight: bold;">\n</span>   &quot;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #006600; font-style: italic;">//  очищенный текст будет таким &quot;Текст с большим количеством пробелов&quot;</span>
<span style="color: #003366; font-weight: bold;">var</span> cleaned_text  <span style="color: #339933;">=</span> text_to_trim.<span style="color: #660066;">clean</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></div></div>



<p>Как показывает пример, функция <strong>clean()</strong> – это тотже <strong>trim()</strong>, только с возможностью чистки пробелов внутри текста. Таким образом, эта функция почистит весь текст от пробелов в количестве более 2-х поряд, и от всех табов (\t) и разрывов строк (\n). Давайте сравним результаты работы этих двух функций:</p>


<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #003366; font-weight: bold;">var</span> cleanDemo <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
	<span style="color: #006600; font-style: italic;">//Прикрепляем исходник к переменной</span>
	<span style="color: #003366; font-weight: bold;">var</span> text_to_clean <span style="color: #339933;">=</span>  <span style="color: #3366CC;">'            слишком <span style="color: #000099; font-weight: bold;">\n</span>       много<span style="color: #000099; font-weight: bold;">\n</span>       пробелов              '</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #339933;">&amp;</span>nbsp<span style="color: #339933;">;</span>
	<span style="color: #006600; font-style: italic;">//Чистим</span>
	<span style="color: #003366; font-weight: bold;">var</span> cleaned_text <span style="color: #339933;">=</span> text_to_clean.<span style="color: #660066;">clean</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #339933;">&amp;</span>nbsp<span style="color: #339933;">;</span>
&nbsp;
	<span style="color: #006600; font-style: italic;">//Выводим результат в окно alert()</span>
	<span style="color: #000066;">alert</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'До чистки : <span style="color: #000099; font-weight: bold;">\n</span>'</span> <span style="color: #339933;">+</span> 
		  <span style="color: #3366CC;">'|-'</span> <span style="color: #339933;">+</span> text_to_clean <span style="color: #339933;">+</span> <span style="color: #3366CC;">'-|<span style="color: #000099; font-weight: bold;">\n</span><span style="color: #000099; font-weight: bold;">\n</span>'</span> <span style="color: #339933;">+</span>
&nbsp;
		  <span style="color: #3366CC;">'После чистки : <span style="color: #000099; font-weight: bold;">\n</span>'</span> <span style="color: #339933;">+</span>  
	      <span style="color: #3366CC;">'|-'</span> <span style="color: #339933;">+</span> cleaned_text <span style="color: #339933;">+</span> <span style="color: #3366CC;">'-|'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #009900;">&#125;</span></pre></div></div>



<p>
  <button id="clean">Чистка</button>
</p>
<h3>contains()</h3>
<p>Как и 2 предыдущие рассмотренные функции, функция Mootools <strong>contains()</strong> делает одну очень простую вещь, без особенностей и заморочек: она проверяет, содержиться ли в исходном тексте заданная строка. В качестве результата работы возвращается <strong>True</strong> если вхождения есть и <strong>False</strong> – если нет.</p>


<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #006600; font-style: italic;">//Строка с исходным текстом</span>
<span style="color: #003366; font-weight: bold;">var</span> string_to_match <span style="color: #339933;">=</span> <span style="color: #3366CC;">&quot;В этом тексте ведем поиск?&quot;</span><span style="color: #339933;">;</span>
<span style="color: #339933;">&amp;</span>nbsp<span style="color: #339933;">;</span>
<span style="color: #006600; font-style: italic;">//Ищем слово &quot;тексте&quot;, did_string_match возвращает true</span>
<span style="color: #003366; font-weight: bold;">var</span> did_string_match <span style="color: #339933;">=</span> string_to_match.<span style="color: #660066;">contains</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'тексте'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #339933;">&amp;</span>nbsp<span style="color: #339933;">;</span>
<span style="color: #006600; font-style: italic;">//Ищем слово &quot;ужас&quot;, функция возвращает False</span>
did_string_match <span style="color: #339933;">=</span> string_to_match.<span style="color: #660066;">contains</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'ужас'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></div></div>



<p>Эта функция может пригодится во многих приложениях на Вашем сайте/блоге/сайте, особенно в комплексе с другими Mootools функциями. Например, если использовать функцию <strong>clean()</strong> с функцией <strong>each()</strong> для приминения пользовательской функции к каждому элементу массива (<a href="http://php.infoniac.ru/mootorial-arrays-day3.html" title="30 дневный курс подготовки юного бойца – Mootools 1.2 – Урок 3 – Массивы  30 дневный курс подготовки юного бойца – Mootools 1.2 – Урок 3 – Массивы">см. урок 3</a>), можно сделать довольно многое, засоряя лишь несколько строк. Например, если мы создадим некий массив слов, запрещенных к использованию в комментариях, можно просмотреть весь текст на предмет использования этих слов. При этом, используется не такая уж и большая фукнция:</p>


<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;">	string_to_match <span style="color: #339933;">=</span> <span style="color: #3366CC;">&quot;сюда вставляем любой текст, в котором нужно проводить поиски&quot;</span><span style="color: #339933;">;</span>
	word_array <span style="color: #339933;">=</span> <span style="color: #009900;">&#91;</span><span style="color: #3366CC;">'слова'</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">'которые'</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">'нужно'</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">'найти'</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">;</span>
&nbsp;
	<span style="color: #006600; font-style: italic;">//Передаем каждое слово в качестве переменного аргумента функции</span>
	word_array.<span style="color: #660066;">each</span><span style="color: #009900;">&#40;</span><span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span>word_to_match<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
		<span style="color: #006600; font-style: italic;">//Поиск текущего слова</span>
		<span style="color: #000066; font-weight: bold;">if</span> <span style="color: #009900;">&#40;</span>string_to_match.<span style="color: #660066;">contains</span><span style="color: #009900;">&#40;</span>word_to_match<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
&nbsp;
			<span style="color: #000066;">alert</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'было найдено слово'</span> <span style="color: #339933;">+</span> word_to_match <span style="color: #339933;">+</span> <span style="color: #3366CC;">'! НЕХОРОШО!'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
		<span style="color: #009900;">&#125;</span><span style="color: #339933;">;</span>
&nbsp;
	<span style="color: #009900;">&#125;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></div></div>



<p>На базе такого примера можно сотворить много чудесных скриптиков, как например такой инструмент, вылавливающий нецензурные и бранные слова или названия конкурентных товаров или брендов <img src='http://php.infoniac.ru/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' />  </p>


<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #003366; font-weight: bold;">var</span> containsDemo <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">function</span> <span style="color: #009900;">&#40;</span>textAreaID<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
&nbsp;
	<span style="color: #006600; font-style: italic;">//Создаем список запрещенных слов</span>
	<span style="color: #003366; font-weight: bold;">var</span> banned_words <span style="color: #339933;">=</span> <span style="color: #009900;">&#91;</span><span style="color: #3366CC;">'BMW'</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">'Audi'</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">'Fererro Roche'</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">'хрень'</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">'херня'</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">'мудак'</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">;</span>	
&nbsp;
<span style="color: #339933;">&amp;</span>nbsp<span style="color: #339933;">;</span>
	<span style="color: #006600; font-style: italic;">//берем содержимое тега textarea</span>
	<span style="color: #003366; font-weight: bold;">var</span> textarea_input <span style="color: #339933;">=</span> $<span style="color: #009900;">&#40;</span>textAreaID<span style="color: #009900;">&#41;</span>.<span style="color: #660066;">get</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'value'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #339933;">&amp;</span>nbsp<span style="color: #339933;">;</span>
	<span style="color: #006600; font-style: italic;">//эта переменная будет отвечать за количество НЕ найденых совпадений</span>
    <span style="color: #006600; font-style: italic;">//чтобы можно было отблагодарить пользователей</span>
    <span style="color: #006600; font-style: italic;">//за чистоту речи, если вдруг такое случится</span>
	<span style="color: #003366; font-weight: bold;">var</span> i <span style="color: #339933;">=</span> <span style="color: #CC0000;">0</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #339933;">&amp;</span>nbsp<span style="color: #339933;">;</span>
   	<span style="color: #006600; font-style: italic;">//используя функцию each() пробегаем по каждому слову этого текста</span>
	banned_words.<span style="color: #660066;">each</span><span style="color: #009900;">&#40;</span><span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span>banned_word<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
		<span style="color: #006600; font-style: italic;">//ищем запрещенные слова указанные в списке</span>
&nbsp;
		<span style="color: #000066; font-weight: bold;">if</span> <span style="color: #009900;">&#40;</span>textarea_input.<span style="color: #660066;">contains</span><span style="color: #009900;">&#40;</span>banned_word<span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
<span style="color: #339933;">&amp;</span>nbsp<span style="color: #339933;">;</span>
			<span style="color: #006600; font-style: italic;">//Сообщаем пользователю, что такие плохие слова использовать очень плохо!</span>
			<span style="color: #000066;">alert</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'Слово '</span> <span style="color: #339933;">+</span> banned_word <span style="color: #339933;">+</span> <span style="color: #3366CC;">' тут использовать нельзя!'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
		<span style="color: #009900;">&#125;</span>
		<span style="color: #006600; font-style: italic;">//Если совпадение по очередному слову не найдено</span>
        <span style="color: #006600; font-style: italic;">//перемнная i увеличивается на 1</span>
		<span style="color: #000066; font-weight: bold;">else</span> <span style="color: #339933;">++</span>i<span style="color: #339933;">;</span>
	<span style="color: #009900;">&#125;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
    <span style="color: #006600; font-style: italic;">//Если i ровняется количеству запрещенных слов, значит пользователь их не использовал</span>
    <span style="color: #006600; font-style: italic;">//Благодарим пользователя за чистоту речи</span>
	<span style="color: #000066; font-weight: bold;">if</span> <span style="color: #009900;">&#40;</span>i<span style="color: #339933;">==</span>banned_words.<span style="color: #660066;">length</span><span style="color: #009900;">&#41;</span> <span style="color: #000066;">alert</span> <span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;Спасибо, что не используете ненависные нам слова!&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #009900;">&#125;</span></pre></div></div>



<p>
  <textarea cols="70" rows="4" id="textarea_1">Как-то раз ехал на своем BMW на фабрику Fererro Roche и тут меня подрезает какой-то мудак на своем Audi. Я ему вдогонку кричу «Ты что за хрень вытворяешь, мудак!!! Что за херня!»</textarea>
  <br />
  <button id="contains">Проверка на запрещенные слова</button>
</p>
<p>
  <textarea cols="70" rows="5" id="textarea_2" style="padding: 5px;">Как-то раз ехал на своем автомобиле на фабрику одной известной компании по производству всяких разных сладостей и тут меня подрезает какой-то нехороший человек на своем автомобиле. Я ему вдогонку кричу «Ты что за нехорошую вещь вытворяешь, нехороший человек!!! Ну как же так?! Что за люди то неприличные!?!»</textarea>
  <br />
  <button id="contains2">Проверка на запрещенные слова</button>
</p>
<h3>substitute()</h3>
<p>Функция <strong>substitute()</strong> – это очень мощный инструмент несмотря на свою кажущююся простоту. Сегодня мы затронем лишь ее основы, но отметим, что основная мощь ее исходит из возможности использовать ее с регулярными выражениями, которые мы рассмотрим в последующих уроках. Однако, только лишь основные возможности этой функции уже позволяет немного поиздеваться над исходным текстом.</p>


<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #006600; font-style: italic;">//Это текст, который функция будет использовать</span>
<span style="color: #006600; font-style: italic;">//в качестве шаблона. Обращаю внимание, что слова, которые </span>
<span style="color: #006600; font-style: italic;">//нужно заменить, помещаются в фигурные скобки</span>
<span style="color: #003366; font-weight: bold;">var</span> text_for_substitute <span style="color: #339933;">=</span> <span style="color: #3366CC;">&quot;Майонез - это {один},  Кетчуп - это {два}, Горчица - это {три}.&quot;</span><span style="color: #339933;">;</span>
<span style="color: #339933;">&amp;</span>nbsp<span style="color: #339933;">;</span>
<span style="color: #006600; font-style: italic;">//Далее содаем объекс, в котором содержаться правила замены</span>
&nbsp;
<span style="color: #006600; font-style: italic;">//Слова справа, не помещенные в кавычки - это слова</span>
<span style="color: #006600; font-style: italic;">//которые будут заменены словами слева, помещенными</span>
<span style="color: #006600; font-style: italic;">//в кавычки</span>
<span style="color: #003366; font-weight: bold;">var</span> substitution_object <span style="color: #339933;">=</span> <span style="color: #009900;">&#123;</span>
	один<span style="color: #339933;">:</span> <span style="color: #3366CC;">'лучшая заправка для салата'</span><span style="color: #339933;">,</span> 
	два<span style="color: #339933;">:</span> <span style="color: #3366CC;">'соус, который хорошо подходит к мясу, особенно к шашлыку'</span><span style="color: #339933;">,</span> 
	три<span style="color: #339933;">:</span> <span style="color: #3366CC;">'такая замазка, иногда горькая, но в основном не очень. Хорошо  к мясу тоже подходит'</span>
&nbsp;
    <span style="color: #009900;">&#125;</span><span style="color: #339933;">;</span>
<span style="color: #339933;">&amp;</span>nbsp<span style="color: #339933;">;</span>
<span style="color: #006600; font-style: italic;">//вызываем функцию substitute() с объектом, </span>
<span style="color: #006600; font-style: italic;">//в котором находятся шаблоны замены   </span>
<span style="color: #003366; font-weight: bold;">var</span> new_string <span style="color: #339933;">=</span> text_for_substitute.<span style="color: #660066;">substitute</span><span style="color: #009900;">&#40;</span>substitution_object<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> 
&nbsp;
<span style="color: #339933;">&amp;</span>nbsp<span style="color: #339933;">;</span>
<span style="color: #006600; font-style: italic;">//теперь наш текст выглядит вот так:</span>
<span style="color: #006600; font-style: italic;">//&quot;Майонез - это лучшая заправка для салата,</span>
<span style="color: #006600; font-style: italic;">//Кетчуп - это соус, который хорошо подходит к мясу, особенно к шашлыку,</span>
<span style="color: #006600; font-style: italic;">//Горчица - это такая замазка, иногда горькая, но в основном не очень. Хорошо  к мясу тоже подходит.&quot;</span></pre></div></div>



<p>Вообще не всегда обязательно нужно создавать объект с шаблонами, т.к. можно обойтись и таким кодом:</p>


<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #006600; font-style: italic;">//Создаем текст с отметками для замены</span>
<span style="color: #003366; font-weight: bold;">var</span> text_for_substitute <span style="color: #339933;">=</span> <span style="color: #3366CC;">&quot;{это_нужно_заменить} и оригинальный текст&quot;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #006600; font-style: italic;">//А шаблон для замены в виде объекта можно передать функции substitute()</span>
<span style="color: #006600; font-style: italic;">//в виде параметра</span>
<span style="color: #003366; font-weight: bold;">var</span> result_text <span style="color: #339933;">=</span> text_for_substitute.<span style="color: #660066;">substitute</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#123;</span>это_нужно_заменить<span style="color: #339933;">:</span> <span style="color: #3366CC;">'Значение замены'</span><span style="color: #009900;">&#125;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #006600; font-style: italic;">//результатом функции будет &quot;Значение замены и оригинальный текст&quot;</span></pre></div></div>



<p>Чем дальше, тем глубже! Вместо стандартных словоформ в кавычках (слова слева) можно использовать элементы DOMа, т.е. можно создавать более интерактивные приложения на сайте:</p>


<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #003366; font-weight: bold;">var</span> substituteDemo <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
	<span style="color: #006600; font-style: italic;">//Берем оригинальный тест из соответствующего элемента DOM</span>
&nbsp;
	<span style="color: #003366; font-weight: bold;">var</span> original_text <span style="color: #339933;">=</span> $<span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'substitute_span'</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">get</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'html'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #339933;">&amp;</span>nbsp<span style="color: #339933;">;</span>
	<span style="color: #006600; font-style: italic;">//Определяем, чем будем заменять:</span>
	<span style="color: #006600; font-style: italic;">//а заменять мы будем текстом введеным в текстовое поле</span>
	<span style="color: #003366; font-weight: bold;">var</span> new_text <span style="color: #339933;">=</span> original_text.<span style="color: #660066;">substitute</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#123;</span>
&nbsp;
		первый  <span style="color: #339933;">:</span> $<span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'first_value'</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">get</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'value'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
		второй <span style="color: #339933;">:</span> $<span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'second_value'</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">get</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'value'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
&nbsp;
		третий  <span style="color: #339933;">:</span> $<span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'third_value'</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">get</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'value'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">,</span>
	<span style="color: #009900;">&#125;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #339933;">&amp;</span>nbsp<span style="color: #339933;">;</span>
	<span style="color: #006600; font-style: italic;">//Заменяем первоначальный текст на новый</span>
	$<span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'substitute_span'</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">set</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'html'</span><span style="color: #339933;">,</span> new_text<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #339933;">&amp;</span>nbsp<span style="color: #339933;">;</span>
<span style="color: #339933;">&amp;</span>nbsp<span style="color: #339933;">;</span>
	<span style="color: #006600; font-style: italic;">//Отключаем кнопку замены и включаем кнопку сброса</span>
	$<span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'simple_substitute'</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">set</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'disabled'</span><span style="color: #339933;">,</span> <span style="color: #003366; font-weight: bold;">true</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
	$<span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'simple_sub_reset'</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">set</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'disabled'</span><span style="color: #339933;">,</span> <span style="color: #003366; font-weight: bold;">false</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span>
&nbsp;
<span style="color: #339933;">&amp;</span>nbsp<span style="color: #339933;">;</span>
<span style="color: #003366; font-weight: bold;">var</span> substituteReset <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">function</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span>
	<span style="color: #006600; font-style: italic;">//Создаем переменную для первоначального текста</span>
	<span style="color: #003366; font-weight: bold;">var</span> original_text <span style="color: #339933;">=</span> <span style="color: #3366CC;">&quot;|- {first} -- {second} -- {third} -|&quot;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #339933;">&amp;</span>nbsp<span style="color: #339933;">;</span>
	<span style="color: #006600; font-style: italic;">//Заменяем текст в соответствующем элементе на первоначальный </span>
	$<span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'substitute_span'</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">set</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'html'</span><span style="color: #339933;">,</span> original_text<span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #339933;">&amp;</span>nbsp<span style="color: #339933;">;</span>
	<span style="color: #006600; font-style: italic;">//Выключаем кнопку сброса и включаем кнопку замены</span>
	$<span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'simple_sub_reset'</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">set</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'disabled'</span><span style="color: #339933;">,</span> <span style="color: #003366; font-weight: bold;">true</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
	$<span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'simple_substitute'</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">set</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">'disabled'</span><span style="color: #339933;">,</span> <span style="color: #003366; font-weight: bold;">false</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span></pre></div></div>



<p id="substitute_span">|- {первый} — {второй} — {третий} -|</p>
<p>Первая замена: 
<input size="6" id="first_value" type="text"/>
Вторая замена:
<input size="6" id="second_value" type="text"/>
Третья замена:
<input size="6" id="third_value" type="text"/>
<button id="simple_substitute">Замена</button>
<button id="simple_sub_reset">Сброс</button>
</p><p>И, напоследок, еще немного теории. При приминении функции <strong>substitute()</strong> к строке, всегда нужно предоставлять функции объект со всеми парами «ключ : значение», так как иначе функция просто удалит все, что найдет между фигурными скобками (включая сами фигурные скобки). Потому, будьте осторожны, при использовании такой строки в качестве полигона действий:</p>


<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;{раз} блаблабла {два} и пусть бе-бе-бе&quot;</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">substitute</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#123;</span>раз <span style="color: #339933;">:</span> <span style="color: #3366CC;">'текст на замену'</span><span style="color: #009900;">&#125;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></div></div>



<p>В конечном итоге получится</p>
  <button id="last_warning">вот что</button></div><!-- google_ad_section_end -->]]></content:encoded>
			<wfw:commentRss>http://php.infoniac.ru/text-filtering-mootorial9.html/feed/</wfw:commentRss>
		<slash:comments>10</slash:comments>
		</item>
	</channel>
</rss>

