Как использовать YUI, чтобы найти вход по имени и вставить содержимое после - PullRequest
2 голосов
/ 29 мая 2009

Как я могу использовать YUI, чтобы найти ввод текста по имени и вставить после него div?

Например, это не работает:

<input name="some_name" type="text">

<script>
var el = new YAHOO.util.Element(document.createElement('div'));
var some_element = document.getElementsByName('some_name');

// doesn't work .... replacing 'some_element' with 'document.body' works
el.appendTo(some_element);

</script>

Ответы [ 4 ]

4 голосов
/ 29 мая 2009

Как уже упоминалось, document.getElementsByName возвращает массив. Возможно, вы захотите дать вашему входу идентификатор с тем же именем, что и атрибут имени. (Помимо: это обычная и полезная практика для форм. Другие библиотеки js предоставляют полезные расширения, когда вы делаете это.)

<input name="some_name" id="some_name" type="text">
<script>
(function () {
var el = new YAHOO.util.Element(document.createElement('div'));
// var some_element = document.getElementByName('some_name')[0];
var some_element = document.getElementsById('some_name'); // preferred, faster
// el.appendTo(some_element);
YAHOO.util.Dom.insertAfter(el,some_element);
})();
</script>

Также обратите внимание на использование insertAfter вместо appendTo . Вы не хотите, чтобы el был дочерним элементом вашего элемента ввода. Вы хотите, чтобы это был следующий родной брат. Входы не имеют детей. И, наконец, вы добавляете эти переменные в глобальное пространство имен. Это может быть, а может и не быть проблемой, но, как правило, рекомендуется заключить код в анонимную функцию, если только вы не намерены использовать переменные в глобальной области видимости и использовать их позже, но тогда вам может потребоваться предоставить им правильное пространство имен .

Надеюсь, что это помогает (и не слишком много информации.);)

1 голос
/ 29 мая 2009

document.getElementsByName ('some_name') всегда возвращает коллекцию (массив), если вы уверены, что имя уникально, вы можете смело написать это.

var some_element = document.getElementsByName('some_name')[0];
0 голосов
/ 04 сентября 2015

Вы в основном ставите условие и говорите name = "some_name".
Посмотрите код ниже и обратите внимание, что он все еще вставляет

араграф.

<script src="http://yui.yahooapis.com/3.18.1/build/yui/yui-min.js"></script>

<input id="some_id" type="text" name="inpuname" >

<script>
  YUI().use('node', function(Y) {
    var contentNode = Y.Node.create('<p>');
    contentNode.setHTML('Paragraph created by YUI by searching for *INPUNAME*...');
    Y.one('input[name="inpuname"]').insert(contentNode, 'after');
  });
</script>
0 голосов
/ 02 апреля 2015

С YUI 3 теперь вы можете сделать this :

<script src="http://yui.yahooapis.com/3.18.1/build/yui/yui-min.js"></script>

<input id="some_id" type="text">

<script>
  YUI().use('node', function(Y) {
    var contentNode = Y.Node.create('<p>');
    contentNode.setHTML('This is a para created by YUI...');
    Y.one('#some_id').insert(contentNode, 'after');
  });
</script>

Но имейте в виду YUI больше не поддерживается !

...