Вход в абзац № JS

Question

Как я могу создать простую форму ввода, чтобы изменить содержимое тэга p?

Для примера

<input type="text" name="name"><br> 
<p>Hi, NAME HERE</p> 

Я также хотел бы знать, как изменить CSS с входом.

<input type="text" name="image"><br> 
box{ 
    background-image: url("LINK FROM INPUT"); 
} 

Answer 1

Это не возможно сделать это чисто с HTML и CSS, хотя вы можете добавить псевдо-элемент ::before или ::after добавить содержимое непосредственно до или после тегов абзаца. Для непосредственного редактирования элемента вам понадобится JavaScript или jQuery. Вы также можете сделать это с PHP довольно легко.

<input type="text" name="name"><br> 
<p>Hi, $_POST['name']</p> 

Это предполагает, что входной сигнал находится в форме с кнопкой отправки, и форма представления всех данных с POST, или имеет method="POST" набор.

Невозможно произвольно изменить файл CSS без каких-либо дополнительных действий. Здесь потребуется PHP; вы можете включить CSS для класса box на свою страницу в тегах <style> и использовать аналогичный метод, как указано выше.