JQuery: Подчеркните все слова текста

Последнее обновление 21 сентября 2018 11:14:42 (UTC / GMT +8 часов)

script1adsense2code

script1adsense3code

JQuery Практическое упражнение. Часть I: Упражнение 16

Подчеркните все слова текста, используя jQuery.

Пример решения:

HTML-код:

<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-git.js"></script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
 <title>Underline all words of a text through jQuery</title>
 </head>
 <body>
 <p>The best way we learn anything is by practice and exercise questions. Here you have the opportunity to practice the Java programming language concepts by solving the exercises starting from basic to more complex exercises.</p>
 </body>
 </html>

Код CSS:

p span{
    text-decoration: underline;
  }

Код JavaScript:

$('p').each(function() {
var text_words = $(this).text().split(' ');
	$(this).empty().html(function() {
		for (i = 0; i < text_words.length; i++) {
			if (i === 0) {
				$(this).append('<span>' + text_words[i] + '</span>');
			} else {
				$(this).append(' <span>' + text_words[i] + '</span>');
			}
		}
	
	});
});

См. Pen jquery- Practical -упражнение-16 от w3resource ( @ w3resource ) на CodePen .

Внесите свой код и комментарии через Disqus.

Предыдущий: Используя jQuery, удалите все параметры из поля выбора, а затем добавьте один параметр и выберите его.
Далее: Как получить значение текстового поля с помощью jQuery.