Solved

Urgent!!!!!---how to reference a parent HTML element???

Posted on 2004-09-07
7
190 Views
Last Modified: 2012-06-21
hi,

my major code could be:
<script language="JavaScript">
function test(){
var oDiv = document.getElementById("div1");
}
</script>
<table>
<tr>
<td><div id="div1">this is a test</div></td>
</tr>
</table>

my question is how to reference the <td> cell if i need to change its background color? is there something like oDiv.parentNode??

thanks a lot! 300 points will be awarded asap.

viola123
0
Comment
Question by:viola123
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 5
  • 2
7 Comments
 
LVL 33

Expert Comment

by:sajuks
ID: 12003862
// try this
<script language="JavaScript">
function test(){
var oDiv = document.getElementById("div1");
oDiv.parentElement.style.backgroundColor = "#000080";

}
</script>
<table>
<tr>
<td>This is a the first test</td>
<td><div id="div1">this is a test</div></td>
<input type = 'button' value = 'Check' onClick = 'test()'>
</tr>
</table>

0
 
LVL 6

Author Comment

by:viola123
ID: 12003877
hi, sajuks:

thanks for your quick reply, but it's not working. i already solved this problem, the solution is :
<html>
 <head>
  <script language="javascript">
<!--

function hl( img ) {
  var row = findParent( img, "TR" );
  var table = findParent( row, "TABLE" );
  setBackgroundColorOnChildren( table, "TR", "#FFF" );
  row.style.backgroundColor="#ccc";
}

function findParent( ele, tag) {
    while ( ele.parentNode ) {
        if ( ele.parentNode.tagName == tag ) {
            return ele.parentNode;
        }

        ele = ele.parentNode;
    }
}

function setBackgroundColorOnChildren( parent, tag, color ) {
    var children = parent.getElementsByTagName( tag );

    for ( var i =0; i < children.length; i++ ) {
        children[i].style.backgroundColor = color;
    }

}

//-->

</script>
 </head>
<body>
<table>
 <tr><td><img src="images/sort_down.jpg" onclick="hl(this)"></td><td>data1</td><td>data2</td><td>data3</td></tr>
 <tr><td><img src="images/sort_down.jpg" onclick="hl(this)"></td><td>data1</td><td>data2</td><td>data3</td></tr>
 <tr><td><img src="images/sort_down.jpg" onclick="hl(this)"></td><td>data1</td><td>data2</td><td>data3</td></tr>
 <tr><td><img src="images/sort_down.jpg" onclick="hl(this)"></td><td>data1</td><td>data2</td><td>data3</td></tr>
 <tr><td><img src="images/sort_down.jpg" onclick="hl(this)"></td><td>data1</td><td>data2</td><td>data3</td></tr>
 <tr><td><img src="images/sort_down.jpg" onclick="hl(this)"></td><td>data1</td><td>data2</td><td>data3</td></tr>
 <tr><td><img src="images/sort_down.jpg" onclick="hl(this)"></td><td>data1</td><td>data2</td><td>data3</td></tr>
 <tr><td><img src="images/sort_down.jpg" onclick="hl(this)"></td><td>data1</td><td>data2</td><td>data3</td></tr>
 <tr><td><img src="images/sort_down.jpg" onclick="hl(this)"></td><td>data1</td><td>data2</td><td>data3</td></tr>
 <tr><td><img src="images/sort_down.jpg" onclick="hl(this)"></td><td>data1</td><td>data2</td><td>data3</td></tr>
 <tr><td><img src="images/sort_down.jpg" onclick="hl(this)"></td><td>data1</td><td>data2</td><td>data3</td></tr>
 <tr><td><img src="images/sort_down.jpg" onclick="hl(this)"></td><td>data1</td><td>data2</td><td>data3</td></tr>
 <tr><td><img src="images/sort_down.jpg" onclick="hl(this)"></td><td>data1</td><td>data2</td><td>data3</td></tr>
 <tr><td><img src="images/sort_down.jpg" onclick="hl(this)"></td><td>data1</td><td>data2</td><td>data3</td></tr>
 <tr><td><img src="images/sort_down.jpg" onclick="hl(this)"></td><td>data1</td><td>data2</td><td>data3</td></tr>
 <tr><td><img src="images/sort_down.jpg" onclick="hl(this)"></td><td>data1</td><td>data2</td><td>data3</td></tr>
</table>
</div>
</body>
</html>

regards
viola
0
 
LVL 33

Expert Comment

by:sajuks
ID: 12003886
Stange, works in IE.
Still glad you got the answer
0
Salesforce Has Never Been Easier

Improve and reinforce salesforce training & adoption using WalkMe's digital adoption platform. Start saving on costly employee training by creating fast intuitive Walk-Thrus for Salesforce. Claim your Free Account Now

 
LVL 33

Accepted Solution

by:
sajuks earned 300 total points
ID: 12003907
my bad. i went thru your example and now i understood what you wanted to achieve.
0
 
LVL 33

Expert Comment

by:sajuks
ID: 12004074
viola123 you have found a solution by yourself . Why did you accept mine ?
0
 
LVL 6

Author Comment

by:viola123
ID: 12011535
thanks for your effort!

we need not only a solution but also a helpful environment

regards
viola123

0
 
LVL 33

Expert Comment

by:sajuks
ID: 12012710
Thanks for the points and grade :-) then
0

Featured Post

[Webinar] Learn How Hackers Steal Your Credentials

Do You Know How Hackers Steal Your Credentials? Join us and Skyport Systems to learn how hackers steal your credentials and why Active Directory must be secure to stop them. Thursday, July 13, 2017 10:00 A.M. PDT

Question has a verified solution.

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

Article by: DanRollins
This article describes a JavaScript program that creates a maze made of hexagonal cells.  In Part 2 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7850-Hex-Maze-Part-2.html), we'll extend the program by adding a depth-…
This article will give core knowledge of JavaScript and will head in to your first JavaScript program. I am Durvesh Naik and I am here to deal with this series of JavaScript. I will teach you JavaScript in part wise , as its quite boring to read big…
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…

695 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