div verstecken

P

port29

deus.Server
Hallo Leute,

ich habe gerade ein Problem mit einem Script. Eine HTML Seite enthält Bilder. Bilder mit einer bestimmten URI sollten jedoch versteckt werden. Der HTML Code sieht folgendermaßen aus:

Code: 
<div>
###ANDERER CODE###
<img src="testbild.jpg" />
###ANDERER CODE###
</div>

Der JS Code sah bisher so aus:

Code: 
var imgCount = document.getElementsByTagName("img").length;
   
    for(i=0;i<imgCount;i++){
        
if(document.getElementsByTagName("img")[i].src=="testbild.jpg")
            document.getElementsByTagName("img")[i].style.display='none';
    }

Wie man leicht sieht, wird hier einfach nur der display Style des Bildes auf none gesetzt, wenn das Bild gefunden wird. Nun sollte es jedoch anders sein. Es soll nicht das Bild versteckt werden, sondern der <div> um das Bild herum. Hat von euch jemand eine Idee, wie man das am geschicktesten macht?

Eine Idee, die mir gekommen ist, wäre es dem <div> eine ID zu geben, die die Bildzahl enthält und dann anhand der ID dem div den entsprechenden Style zuzuweisen. Aber evtl. gibt es auch eine andere Möglichkeit. Ideen?
 
Zuletzt bearbeitet:
port29 hat gesagt.:
Hallo Leute,
Eine Idee, die mir gekommen ist, wäre es dem <div> eine ID zu geben, die die Bildzahl enthält und dann anhand der ID dem div den entsprechenden Style zuzuweisen. Aber evtl. gibt es auch eine andere Möglichkeit. Ideen?
Zum Vergrößern anklicken....


Genau so gehts, nur mit document.getElementById und ebenfalls display none oder hidden verwenden um das DIV auszublenden.
 
Hi,

du könntest auch vom Bildknoten ausgehend solange die Elternknoten ermitteln, bis du auf ein DIV stösst.
Code: 
<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>www.tutorials.de</title>
<meta name="author" content="Quaese">
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
  <!--
function hideImg(){
  var imgCount = document.getElementsByTagName("img").length;

  for(i=0;i<imgCount;i++){
    if(document.getElementsByTagName("img")[i].src.search(/testbild\.jpg/) != -1){
      // Elternknoten ermitteln
      var objParent = document.getElementsByTagName("img")[i].parentNode;
      // Elternknoten solange durchlaufen, bis ein DIV gefunden wurde
      while(objParent.nodeName.toUpperCase() != "DIV"){
      	objParent = objParent.parentNode;
      }
      objParent.style.display = "none";
    }
  }
}
 //-->
</script>
</head>
<body>
<button onclick="hideImg();">hideImg</button>
<div>
  ###ANDERER CODE###
  <div>Noch ein Div</div>
  <img src="testbild.jpg" />
  ###ANDERER CODE###
</div>
</body>
</html>
Ciao
Quaese
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück