Как осуществить проверку на точное совпадение на jQuery?

Не так давно я реализовал весьма интересное дополнение, о котором вы можете почитать в этой статье. Так вот – там мне было необходимо осуществить проверку на точное совпадение моей фразы с имеющимися данными.

Сначала я решил реализовать это следующим образом:

<ul>
	<li>Один</li>
	<li>Два</li>
	<li>Три</li>
	<li>Четыре</li>
</ul>

<script>

	$("ul li:contains('Два')").css("color", "blue");

</script>

Вроде бы все хорошо, но это до тех пор, пока вы не имеете две похожие фразы, например:

<ul>
	<li>Один</li>
	<li>Два</li>
	<li>Три</li>
	<li>Четыре</li>
	<li>Двадцать</li>
</ul>

<script>

	$("ul li:contains('Два')").css("color", "blue");

</script>

В таком случае определение совпадения происходит не совсем корректно, ведь если лишь часть предложенной фразы совпадает, то нужное нам действие выполняется.

В моем случае мне было необходимо произвести проверку на точное соответствие. Поскольку в jQuery такого селектора не нашлось, было решено добавить свой.

Реализация:

<script>

	$.expr[":"].exact = $.expr.createPseudo(function(arg) {

		return function(element) {

			return $(element).text() === arg.trim();

		};

	});

</script>

Ну и, соответственно, ее использование:

<ul>
	<li>Один</li>
	<li>Два</li>
	<li>Три</li>
	<li>Четыре</li>
	<li>Двадцать</li>
</ul>

<script>

	$.expr[":"].exact = $.expr.createPseudo(function(arg) {

		return function(element) {

			return $(element).text() === arg.trim();

		};

	});
	
	$("ul li:exact('Два')").css("color", "blue");

</script>

В таком случае поиск будет происходить по точной фразе, что, соответственно, нам и нужно.