strimble

Recently, I’ve had a chance to work on a project that uses Dojo as it’s Javascript framework. Prior to this, the only Javascript library I’ve used has been Prototype, along with Scriptaculous. Since I’ve been using Prototype for a while, there are some things I’ve gotten used to and now find useful to quickly create scripts. One of these things is the findElement method.

I primarily use Event.findElement to ensure that I’m getting the element I need from an event. So, if I have some DOM elements that look like the following:

<ul>
     <li id="animals"><a href="/animals/">Animals</a></li>
     <li id="children"><a href="/children/">Children</a></li>
</ul>

I might have a click event on both the li and a elements. However, I might need to get the id just from the li element. Getting that id in Prototype is simple. I would just create a function that looks something like the following:

function getIdFromLi(evt) {
     return evt.findElement('li').id;
}

So, if the user clicks on the a element, findElement would look for the li by first looking at the element that was clicked on and then going up from there. So, it would find the li element as the parentNode of the a element.

I haven’t been able to find something like this in Dojo. So, I found the element I needed like this:

function getIdFromLi(evt) {
     var liElement = evt.target;
     while (liElement.tagName.toLowerCase() !== 'li') {
          liElement = liElement.parentNode;
     }
     return liElement.id;
}

Do you know if there’s anything like this in Dojo? I couldn’t find it, can you?