Как засветить 8й символ красным цветом?

@inquisitor · Регистрация: 22.12.2015

Студворк — интернет-сервис помощи студентам

PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<html>
<body>
   <div class="symbols">lorem ipsum sit ammet dolar </div>
<button onclick="a()">Start</button>
<script>
function a()
                                            {
var container = document.querySelector(".symbols");
var arr = container.innerHTML.split(/\s+/);
 
 
for(var i = 0; i < arr.length; i++)
        {
            if(arr[i]){
                arr[i] = '<span>'+arr[i]+'</span>';
                            if(arr[i]==8)
                                 {
                                    
                                 }
                      }
        }
 
container.innerHTML = arr.join(' ');
 
                                            }
 
</script>
</body>
</html>

@Evgen1337 · 24.07.2018, 23:46

PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<html>
 
<body>
  <div class="symbols">lorem ipsum sit ammet dolar </div>
  <button onclick="a()">Start</button>
  <script>
    function a() {
      var container = document.querySelector(".symbols");
      container.innerHTML = container.innerText.split('').map((letter, idx) => {
        return `<span style="color:${idx === 7 ? 'red' : 'black'}">${letter}</span>`;
      }).join('')
    } 
  </script>
</body>
 
</html>

@diadiavova · 25.07.2018, 01:14

JavaScript
1
2
var container = document.querySelector(".symbols");
container.innerHTML = container.textContent.replace(/(.{7})(.)/, "$1<span style='color:red;'>$2</span>");

@inquisitor · 26.07.2018, 23:04 **[ТС]**

Сообщение от diadiavova

Javascript

а в цикле можно подсвечивать,что бы вместо 7 подставлять i
?

@diadiavova · 27.07.2018, 00:29

Сообщение от scherbakovss201

а в цикле можно подсвечивать,что бы вместо 7 подставлять i
?

Да можно, конечно, но это уже другая задача. Что-то подобное сделал Evgen1337, он просто упаковал каждую букву в спан, а мне такой подход показался слишком расточительным, поэтому я привел код, где упаковывается только нужный символ.
Правда не очень понятно, зачем подкрашивать все символы по одному, и в цикле, когда можно все сразу окрасить. Или тебе анимация нужна, ну типа сначала один подкрасить, потом другой?

@AlexZaw · 27.07.2018, 01:26

Не по теме:

Сообщение от diadiavova

Или тебе анимация нужна, ну типа сначала один подкрасить, потом другой?

Этот вопрос про анимацию длится уже месяц. ТС были предоставлены различные готовые решения, вот только он сам не знает чего хочет,ну или не может объяснить.
Да вы и сами отвечали в одной из тем по этому поводу.

@diadiavova · 27.07.2018, 01:39

Не по теме:

Сообщение от AlexZaw

Да вы и сами отвечали в одной из тем по этому поводу.

Ну я, помятуя о той теме, как раз и предположил, что все не так просто. ))

Сообщение от AlexZaw

вот только он сам не знает чего хочет,ну или не может объяснить.

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

@AlexZaw · 27.07.2018, 01:48

Не по теме:

Сообщение от diadiavova

Возможно у него просто есть несколько похожих задач

Возможно, вот только каждый следующий шаг либо придумывается на ходу, либо приходится вытягивать клещами.
Хоть это и неплохая практика для тех же начинающих, если они решают эти задачки, но такая манера жутко раздражает :(

@inquisitor · 27.07.2018, 11:28 **[ТС]**

Сообщение от diadiavova

Правда не очень понятно, зачем подкрашивать все символы по одному, и в цикле, когда можно все сразу окрасить. Или тебе анимация нужна, ну типа сначала один подкрасить, потом другой?

Типа анимации.
Вариант 1 - это сначала подкрашиваеться первая буква,потом вторая и т.д с интервалом 1 секунда.
Вариант 2 сначала подкрашиваеться первая буква.после она остается красной,потом следующий символ и так пока все буквы не станут красными.Потом с конца слова по одному символу делать черным.

@AlexZaw · 27.07.2018, 12:39

Не по теме:

Вангую! Дальше нужно будет сделать так, чтобы символы меняли цвет в случайном слове...

Новые блоги и статьи Все статьи Все блоги /
Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .	И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.	«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»	SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image 8Observer8 10.02.2026 Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .	Установка Qt-версии Lazarus IDE в Debian Trixie Xfce volvo 10.02.2026 В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .	SDL3 для Web (WebAssembly): Работа со звуком через SDL3_mixer 8Observer8 08.02.2026 Содержание блога Пошагово создадим проект для загрузки звукового файла и воспроизведения звука с помощью библиотеки SDL3_mixer. Звук будет воспроизводиться по клику мышки по холсту на Desktop и по. . .

@AlexZaw
	27.07.2018, 12:39
	Не по теме: Вангую! Дальше нужно будет сделать так, чтобы символы меняли цвет в случайном слове... 0

Как засветить 8й символ красным цветом?

Решение