Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/topic.php on line 737
Форумы портала PHP.SU :: Как с помощью js добавлять текст внутрь тегов?

 PHP.SU

 Программирование на PHP, MySQL и другие веб-технологии
PHP.SU Портал     На главную страницу форума Главная     Помощь Помощь     Поиск Поиск     Поиск Яндекс Поиск Яндекс     Вакансии  Пользователи Пользователи


 Страниц (2): [1] 2 »   

> Без описания
Поиск в теме | Версия для печати
Aricus
Отправлено: 29 Сентября, 2014 - 18:29:24
Post Id



Частый гость


Покинул форум
Сообщений всего: 245
Дата рег-ции: Апр. 2014  


Помог: 0 раз(а)
Как создавать элементы и задавать их свойства, я знаю. Но как писать что-то внутрь созданного тега?
Я хочу, чтобы при нажатии на кнопку на страницу добавлялась форма:
CODE (html):
скопировать код в буфер обмена
  1. <form ...> Увеличение параметра до
  2. <input type="text" ... /> баллов
  3. <input type=""image"" ... /> </form>

Я создал элемент:
CODE (javascript):
скопировать код в буфер обмена
  1. function uvTsV() {
  2. var uvTsV = document.getElementById("uvTsV");
  3.         var new_form = document.createElement("form");
  4.         new_form.method = "post";
  5.         ...
  6. uvTsV.appendChild(new_form);

А как вставить текст, не знаю.
 
 Top
teddy
Отправлено: 29 Сентября, 2014 - 18:44:13
Post Id


Участник


Покинул форум
Сообщений всего: 1462
Дата рег-ции: Апр. 2013  


Помог: 91 раз(а)
Если нужно задать текст для элемента, то можно использовать innerText.

Вот простой пример
CODE (javascript):
скопировать код в буфер обмена
  1. var div = document.createElement('div');
  2. div.innerText = 'Hello, World!';
  3. document.body.appendChild(div);

(Добавление)
а value для инпута можно задать так:
CODE (javascript):
скопировать код в буфер обмена
  1. var input = document.createElement('input');
  2. input.value = 'some value';
 
 Top
Aricus
Отправлено: 29 Сентября, 2014 - 19:40:31
Post Id



Частый гость


Покинул форум
Сообщений всего: 245
Дата рег-ции: Апр. 2014  


Помог: 0 раз(а)
Спасибо. Ещё вопросик: у меня в примере тег между 2 кусками текста. Чтобы так сделать, придётся городить <span>ы, или есть способ попроще?
 
 Top
teddy
Отправлено: 29 Сентября, 2014 - 20:11:45
Post Id


Участник


Покинул форум
Сообщений всего: 1462
Дата рег-ции: Апр. 2013  


Помог: 91 раз(а)
Не за что. Если честно не очень понял вопрос, приведите пример с разметкой, что есть, чего нет, что должно быть и где это должно лежать Улыбка
 
 Top
Aricus
Отправлено: 29 Сентября, 2014 - 20:57:18
Post Id



Частый гость


Покинул форум
Сообщений всего: 245
Дата рег-ции: Апр. 2014  


Помог: 0 раз(а)
Ну, у меня внутри формы:
CODE (html):
скопировать код в буфер обмена
  1. Увеличение параметра до
  2. <input type="text" ... />
  3.  баллов
  4. <input type=""image"" ... />

Я понял только как создать c помощью js элементы:
CODE (html):
скопировать код в буфер обмена
  1. <span> </span>
  2. <input />
  3. <span> </span>
  4. <input />

и внутрь <span> поместить соответствующие куски текста
CODE (javascript):
скопировать код в буфер обмена
  1. new_span.innerText = 'Увеличение параметра до ';

Вот я и спрашиваю, нет ли способа попроще?
 
 Top
teddy
Отправлено: 29 Сентября, 2014 - 21:09:22
Post Id


Участник


Покинул форум
Сообщений всего: 1462
Дата рег-ции: Апр. 2013  


Помог: 91 раз(а)
Хм... способ ведь и так простой: 1.создали элемент 2.добавили ему текст.
Если Вам нужно добавить 2 спана, то их в любом случае нужно будет создать и добавить каждому из них свой текст.

(Отредактировано автором: 29 Сентября, 2014 - 21:09:49)

 
 Top
armancho7777777 Супермодератор
Отправлено: 29 Сентября, 2014 - 21:33:19
Post Id



Активный участник


Покинул форум
Сообщений всего: 4526
Дата рег-ции: Февр. 2011  
Откуда: Москва


Помог: 221 раз(а)
CODE (javascript):
скопировать код в буфер обмена
  1. var block = document.createElement('div');
  2.  
  3. block.innerHTML = 'Увеличение параметра до'
  4.                 + '<input type="text" ... />'
  5.                 + 'баллов'
  6.                 + '<input type=""image"" ... />';
  7.  
  8. document.body.appendChild(block);
 
 Top
teddy
Отправлено: 29 Сентября, 2014 - 21:36:05
Post Id


Участник


Покинул форум
Сообщений всего: 1462
Дата рег-ции: Апр. 2013  


Помог: 91 раз(а)
armancho7777777
А зачем в таком случае использовать js? Можно просто Вашу разметку поставить в HTML не используя js и делов то Улыбка
 
 Top
IllusionMH
Отправлено: 29 Сентября, 2014 - 21:37:42
Post Id



Активный участник


Покинул форум
Сообщений всего: 4254
Дата рег-ции: Февр. 2011  
Откуда: .kh.ua


Помог: 242 раз(а)
Aricus, для мелких форм можно заюзать element.innerHTML и не париться. Но если хочется попариться, тогда document.createTextNode
 
 Top
armancho7777777 Супермодератор
Отправлено: 29 Сентября, 2014 - 21:37:57
Post Id



Активный участник


Покинул форум
Сообщений всего: 4526
Дата рег-ции: Февр. 2011  
Откуда: Москва


Помог: 221 раз(а)
Я думаю, Aricus разберётся, что делать с этим примером.
 
 Top
IllusionMH
Отправлено: 29 Сентября, 2014 - 21:39:02
Post Id



Активный участник


Покинул форум
Сообщений всего: 4254
Дата рег-ции: Февр. 2011  
Откуда: .kh.ua


Помог: 242 раз(а)
teddy, а если это вставляется и генерируется автоматически? Проще собрать строку, чем изващаться с текстовыми нодами.
 
 Top
armancho7777777 Супермодератор
Отправлено: 29 Сентября, 2014 - 21:40:19
Post Id



Активный участник


Покинул форум
Сообщений всего: 4526
Дата рег-ции: Февр. 2011  
Откуда: Москва


Помог: 221 раз(а)
IllusionMH пишет:
тогда document.createTextNode

Вы, наверное, хотели сказать document.createDocumentFragment
 
 Top
teddy
Отправлено: 29 Сентября, 2014 - 21:49:49
Post Id


Участник


Покинул форум
Сообщений всего: 1462
Дата рег-ции: Апр. 2013  


Помог: 91 раз(а)
IllusionMH
Я думаю все зависит от ситуации. Раз уж речь пошла о "что если нужно делать на лету", то может быть так, что придется добавлять ещё и дополнительные атрибуты самим элементам, которые могут меняться в зависимости от чего либо, в таком случае работа с нодами на мой взгляд будет удобнее.

А если это какой то заранее известный хтмл то проще написать его в каком то блоке и скрыть этот блок. А когда надо показать просто поменять этому блоку дисплей и все

(Отредактировано автором: 29 Сентября, 2014 - 21:51:26)

 
 Top
IllusionMH
Отправлено: 29 Сентября, 2014 - 21:56:07
Post Id



Активный участник


Покинул форум
Сообщений всего: 4254
Дата рег-ции: Февр. 2011  
Откуда: .kh.ua


Помог: 242 раз(а)
armancho7777777, нет.
http://www[dot]w3[dot]org/TR/2000/REC-DO[dot][dot][dot]ml#ID-1975348127
https://developer[dot]mozilla[dot]org/en[dot][dot][dot]t[dot]createTextNode
Но это если хочется изощряться.
(Добавление)
teddy, для формы может быть принципиальным наличие/отсутствие скрытого блока.
Да и если текст содержит элементы(уже неудобно, но у ТСа так), ИМХО проще использовать innerHTML + получить элементы и поменять их атрибуты/свойства при необходимости.
Дальше уже переходить к шаблонизаторам Улыбка

(Отредактировано автором: 29 Сентября, 2014 - 22:01:12)

 
 Top
armancho7777777 Супермодератор
Отправлено: 29 Сентября, 2014 - 22:01:21
Post Id



Активный участник


Покинул форум
Сообщений всего: 4526
Дата рег-ции: Февр. 2011  
Откуда: Москва


Помог: 221 раз(а)
IllusionMH, Вы думаете, я не знаю, для чего нужен метод createTextNode ?
Это у Вас надо спросить, каким образом Вы связали свойство innerHTML с этим методом,
так как уместнее в таком случае свойство innerText
 
 Top
Поиск в теме | Версия для печати
Страниц (2): [1] 2 »
Сейчас эту тему просматривают: 0 (гостей: 0, зарегистрированных: 0)
« JavaScript & VBScript »


Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.
  



Powered by PHP  Powered By MySQL  Powered by Nginx  Valid CSS  RSS

 
Powered by ExBB FM 1.0 RC1. InvisionExBB