Переход к определенному дочернему элементу с прототипом

Question

Учитывая следующую разметку.

<div id="example"> 
    <div> 
    <div> 
     <input type='hidden'></input> 
    </div> 
    </div> 
</div> 

Как можно быстро получить скрытый элемент ввода дал мне иметь идентификатор для верхних наиболее сНа элемента с идентификатором «например»?

Я могу взломать его, чтобы я мог просто перебирать каждый дочерний элемент до тех пор, пока не нажму на вход, однако я бы хотел улучшить его и использовать Prototype и просто перейти к этому скрытому вводу, заданному div.

Спасибо!

Answer 1

$$('#example input[type=hidden]').first() 

Answer 2

Прототип предоставляет целую кучу способов сделать это:

// This, from Bill's answer, is probably the fastest, since it uses the 
// Browser's optimized selector engine to get straight to the element 
$$('#example input[type=hidden]').first(); 

// This isn't bad either. You still use the browser's selector engine 
// To get straight to the #example element, then you must traverse a 
// (small) DOM tree. 
// 
// element.down(selector) selects the first node matching the selector which 
// is an decendent of element 
$('example').down('input'); 

// Here, you'll get an array containing all the inputs under 'example'. In your HTML 
// there is only one. 
$('example').select('input') 

// You can also use element.select() to combine separate groups of elements, 
// For instance, if you needed all the form elements: 
$('example').select('input', 'textarea', 'select'); 

Answer 3

Я предпочитаю прямой подход

document.forms[0].fieldName.value 

Что меньше кода, нет необходимости использовать JQuery и является более дружелюбный к дизайну кода.