Динамическое добавление контента на страничку

Всем привет! это вторая часть верстки фото галереи)). HTML и CSS написан теперь стоит задача добавить при нажатии на кнопку картинку на страницу без перезагрузки самой странички. подскажите как это можно реализовать так-как в js у меня опыта вообще нету. сейчас страничка выглядит так:

Используй $.ajax - почитай примеры как им пользоваться

что-бы использовать аякс нужен сервер. мне нужно написать с помощью чистого js, angular и тд

Простейшее что можно сделать - добавить новый узел к списку существующих.

var IMAGE_LIST_NODE_SELECTOR = '.gallery-items'
var imageListNode = document.querySelector(IMAGE_LIST_NODE_SELECTOR)

function createImageListItem(url) {
	var el = document.createElement('li')
	el.innerHTML = '<img src="' + url + '"/>' 
	return el
}

function addListItem(url) {
	imageListNode.appenChild(createImageListItem(url))	
}

Чего в этом коде нет:

  • запроса адреса картинки, которую добавлять
  • сохранения состояния (после перезагрузки все изменения пропадут)

смотри я уже сделал окошко выбора файла


я хотел как-то сначала копировать изображение с комп*ютера в папку img проекта, и путь прописывать уже исходя из этой директории

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

Тебе интересно что-то вроде такого: http://stackoverflow.com/a/3814285: использовать поле типа файл, навесить на него обработчик события, получить data-uri (это такая строка) изображения, и с помощью кода, что я кинул выше, вставить изображение как data-uri.

блин а может это как в прошлом посте с флексами)) и не нужно что бы изображения сохранялись по логике ведь для хранения данных нужен сервер. мол одноразовая подгрузка картинок потестить чисто клиент без сервака. со старта на страничке онли кнопка для загрузки картинок и за одну сессию ты загрузил посмотрел че как работает и все) без сохранения. тогда мне и не нужно будет ничего копировать а только путь к файлу считать как-то с этого инпута.

Я не знаю лучшего способа решить твою задачу.

Так и будет работать та схема, что я описал выше.

Браузер по соображениям безопасности не дает пути к файлам на файловой системе (иначе веб странички погли бы шерстить по твоему компьютеру).

ну я сча обмозгую что ты накидал)) думаю все получится