Получение элементов потомков с определенным тегом jQuery

Question

Я пытаюсь получить все входные элементы из определенной формы из jQuery, указав только имя формы и зная, что эти нужные поля являются входными элементами.

Допустим,

<form action='#' id='formId'>
<input id='name' />
<input id='surname'/>
</form>

Как мне получить к ним индивидуальный доступ с помощью jQuery? Я попытался что-то вроде $('#formId > input') безуспешно, на самом деле ошибка вернулась на консоли "XML filter is applied to non-XML value (function (a, b) {return new (c.fn.init)(a, b);})"

Может быть, я должен сделать это с .children или что-то в этом роде? Я довольно новичок в jQuery и мне не очень нравятся Документы. В Mootools было гораздо дружелюбнее, или, может быть, мне просто нужно к этому привыкнуть.

Да, и последнее, но не менее важное: я уже видел этот вопрос, но не получил окончательного ответа. Могу ли я создать новый элемент dom с помощью jQuery и поработать с ним, прежде чем вставлять его (если я когда-нибудь это сделаю) в код de? В mootools у нас было что-то вроде var myEl = new Element(element[, properties]); и вы могли бы обратиться к нему в дальнейших выражениях, но я не понимаю, как это сделать на jQuery

То, что я в итоге сделал, было примерно таким: $('#where').before("<a id='linkId' href='#'>Link Text</a>"), но это противоречит требованию работы с ним перед вставкой, если вы понимаете, о чем я.

Заранее спасибо.

Answer 1

Если вы хотите, чтобы все потомки, то ответ @ woland работает. Если вы действительно хотите только прямых детей, как указано вашим> тогда

$('#form').children('input')

Wolands соответствует имени, фамилии и телефону. Мои совпадения, только имя и фамилия

<form action='#' id='formId'>
<input id='name' />
<input id='surname'/>
<div>
<input id='phone'/>
</div>
</form>

Answer 2

Я надеюсь, что это отвечает на ваши вопросы.

<script type="text/javascript">

$(document).ready(function() {
        // Question part 1
    var formInputs = $("form#formId :input");
    formInputs.each(function(index) {
         alert(index + ': ' + $(this).attr("id") + "=" + $(this).val());
    });

        // Question part 2
    var a = $("<a id='linkId' href='#'>Link Text</a>");
    a.click(function(){alert("hello")});
    $('#where').before(a);


});
</script>

<form action="#" id="formId">
  <input id="name" type="text" value="foo" />
  <input id="surname" type="text" value="bar" />
  <div>
  <input id="phone" type="text" value="911"/>
  </div>
</form>
</div>
<div id="where"></div>

Answer 3

Если вы хотите перебрать все входы, взгляните на функцию each() в jQuery:

Answer 4

Вот как это работает:

$('#formId input')