Я недавно начал изучать javascript и столкнулся с проблемой по которой очень много информации но внятно я так и не понял как реализовать. Есть допустим обычный цикл php в котором выводятся значения не важно какие допустим от 0-9, и как сделать так что бы javascript принимал данные значение и преобразовывал в изображение в котором собственно и будут данные числа ( допустим круг в котором будет число 0, 1 и тд). И что бы это работало с любым циклом. Полностью писать ответ не надо просто подтолкните меня к решению какие методы использовать и тд.
Путей несколько. Пара примитивных (которые навряд будут использоваться в средних и больших проектах).
- Сгенерировать html в
php
, и работать с этимhtml
из джаваскрипта. Например сгенерировать такойhtml
<div class='images'>
<img src="img/1.jpg" />
<img src="img/2.jpg" />
<img src="img/3.jpg" />
</div>
А потом получить доступ к узлам изображений:
<script>
[].forEach.call(document.querySelectorAll('.images img'), function (imageNode) {
console.log(imageNode)
})
</script>
- Можно сгенерировать
JSON
объект вphp
, положить его на глобальный уровень, и обратиться к этому объекту изjs
.
Например сгенерировать такой код вphp
<script>
window.jsData = [1, 2, 3, 4]
</script>
И обработать его через js
<script>
window.jsData.forEach(function (imgId) {
console.log(imgId)
})
</script>
- Еще вариант - использовать AJAX или WebSockets для получения
JSON
объекта вjs
. Но этот путь навряд ли что тебе нужно при обучении. Хотя при работе над реальным проектом нужно будет выбирать скорее всего его.
Очень спасибо, второй вариант мне в принципе подходит. А вот третий заинтерисовал. Можно какойнить информации по третему?
Читай про https://ru.wikipedia.org/wiki/AJAX. Есть программа на сервере, есть программа на клиенте. Серверная программа по протоколу http передает данные (json) если ей отправить запрос. Клиентская программа отправляет запрос, получает ответ.
Этот форум работает по такому принципу.
На php
примеров не знаю, надо подождать пока кто-то с опытом php
ответит.
Есть пример на js
. Страница с примерами https://hidden-brook-8135.herokuapp.com/. Исходный код тут https://github.com/podgorniy/todo-server