Solved

Get Parent Element

Posted on 2008-06-19
7
18,793 Views
Last Modified: 2012-08-14
I have a situation where I would like to find the parent element of the current element, and I'd like to do so without cluttering up my code with an ID for every element that I need to find.

For instance, say I have the following:

<div>
  <a href="javascript: SomeFunction();">Link Text</a>
<div>

I want the function that is called to find the parent <div> element without giving the parent div and ID and without needing to give the <a> element an ID

I've tried passing "this" to the function, but that gets me no where.

What would I pass to the function and then how would I locate the parent div with that information.

If this isn't clear enough, please let me know an I will supply more information if I can.
0
Comment
Question by:Hube02
  • 3
  • 3
7 Comments
 
LVL 41

Accepted Solution

by:
HonorGod earned 400 total points
ID: 21827686
function SomeFunction( obj ) {
  var parent = obj.parentNode;
  ...

}

<a href="javascript: SomeFunction(this);">Link Text</a>
0
 
LVL 18

Author Comment

by:Hube02
ID: 21827840
This doesn't seem to work for links:

      function SomeFunction( obj ) {
        alert(obj);
        var parent = obj.parentNode;
        alert(parent);
      }

    <a href="javascript: SomeFunction(this);">Link Text</a>

The first alert shows "[object window]" the second "undefined"

But I'd already tested using (this) as I said.

It works if I change it to

      <span onclick="SomeFunction(this)">Link Text</span>

If this can't be done with a link <a href... then I can go to a different element type, but I was hoping to use a link to do this.

0
 
LVL 42

Assisted Solution

by:David S.
David S. earned 100 total points
ID: 21828648
Yeah, you can't use the "this" keyword to refer to a link when you use the href="javascript:SomeFunction()"

You don't have to not use a link though.

<a href="enable-js.html" onclick="SomeFunction(this)">Link Text</a>

Do you really want to use inline event handlers?
0
DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

 
LVL 41

Expert Comment

by:HonorGod
ID: 21830255
Interesting.  I hadn't realized, or I forgot, that in this situation, the "this"
passed in that kind of call would be to the document.

One option would be to have a function executed when the page loads,
that looks for these kinds of links, and changes the onclick attribute to
provide the appropriate reference.

Does this sound like a viable option to you?

0
 
LVL 18

Author Comment

by:Hube02
ID: 21830463
I think I'm going to end up going with using a span and using CSS to make it look like a link. The reason that I wanted to avoid this is the fact that IE6 does not support the pseudo of hover on anything but a link and I don't really want to implement the htchover gizmo for just this.
0
 
LVL 41

Expert Comment

by:HonorGod
ID: 21831029
Well, thank you for sharing your decision with us.  This is one of the
reasons that I find experts-exchange so useful.

Thanks for the grade & points.

Good luck & have a great day
0
 
LVL 18

Author Comment

by:Hube02
ID: 21831297
I know that sometimes the answer is "No, that can't be done that way." And for me this is an acceptable answer. I find these answers just as useful as the ones that tell me how to do something, at least I know I need to head in another direction.

I appreciate the fact that I can just discuss a question with others rather than smacking my head on the monitor.
0

Featured Post

PRTG Network Monitor: Intuitive Network Monitoring

Network Monitoring is essential to ensure that computer systems and network devices are running. Use PRTG to monitor LANs, servers, websites, applications and devices, bandwidth, virtual environments, remote systems, IoT, and many more. PRTG is easy to set up & use.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

When you need to keep track of a simple list of numbers or strings, the Array object is your most direct tool.  As we saw in my earlier EE Article (http://www.experts-exchange.com/A_3488.html), typical array handling might look like this: (CODE) B…
Having worked on larger scale sites, we found out that you are bound to look at more scalable solutions to integrating widgets, code snippets or complete applications and mesh them into functional sites, in any given composition. To share some of…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

773 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question