2010-07-16 3 views
5

J'ai besoin d'une fonction qui démarre lorsque le DOM est chargé.Comment remplacer un <img src=""> vide sur une page avec JavaScript sur dom chargé?

Dans mon page HTML sont plusieurs mots clés de l'image vide, comme je veux ajouter une image-nom dans la Src propriété quand tout est chargé pour obtenir quelque chose comme

<img src="blank.jpg">. 

Meilleurs voeux Chris

+0

Une raison de ne pas utiliser JQuery? – AlG

+0

Oui - nous ne voulons pas surcharger le projet avec d'autres cadres. Nous utilisons déjà dans le prototypeJS large gamme. – ChrisBenyamin

Répondre

6
function replaceSrc() 
{ 

    var images = document.getElementsByTagName('img'); 

    for(var i = 0; i < images.length; i++) 
    { 
     var img = images[i]; 

     if(img.src.length == 0) 
     { 
      img.src = 'blank.jpg'; 
     } 
    } 
} 


window.onload = replaceSrc; 

ou si vous voulez ajouter plus d'un gestionnaire pour l'événement:

document.addEventListener('load', replaceSrc, false) //W3C 
document.attachEvent('onload', replaceSrc); //IE 

Avec jQuery

$(document) 
    .ready(function() { $('img') 
          .filter(function(){ return this.src.length == 0 }) 
           .each(function() { this.src = 'blank.jpg'}) }); 

EDIT:

je réalisais que vous voulez probablement définir la propriété src devant les images de charge alors j'ai changé le code pour tirer sur l'événement de chargement du document, ce qui se passe avant les images commencer à charger.

3

Utilisez jQuery! C'est facile.

$('img').attr('src','new-image-name.jpg') 

Cela définit l'attribut src de chaque balise img à «nouvelle image name.jpg.

2

Avec jQuery, cela définirait l'attribut src de tous les éléments img avec un attribut src vide à "blank.jpg" au chargement de la page.

$.ready(function() { 
    $("img[src='']").attr("src", "blank.jpg"); 
}); 
8

La construction <img src=""> n'est pas valide. Ne l'utilisez jamais.

Ce n'est pas valide car l'URL vide indique URL vers la page en cours. Mais la page actuelle est un document HTML, pas une image. Le navigateur peut faire une autre requête de la page en cours et essayer de l'utiliser comme image (voir this page).

+0

Yup. Dans le pire des cas, cela déclenchera de nombreux appels vers la même page (principale). (Limite de vote quotidienne atteinte, +1 sinon) –

0

Vous pouvez utiliser ce script.

# Script AddImage.txt 
var string pagefile, image, html 
# Read in the page file. 
cat $pagefile > $html 
# Replace all instances of "<img src="blank.jpg">" with the specified image. 
while ({ sen -r -c "^<img src=&\>^" $html } > 0) 
    sal -r -c "^<img src=&\>^" ("<img src=\""+$image+"\">") $html > null 
# Write page back. 
echo $html > { echo $pagefile } 

Le script est en écriture bitmap. Enregistrez le script dans le fichier "C: /Scripts/AddImage.txt", exécutez-le avec cette commande.

script "C:/Scripts/AddImage.txt" pagefile("/path/to/page.html") image("blank.jpg") 

Remplacer l'image précédente par "blank.jpg".

0

Avec JQuery vous pouvez simplement résoudre votre problème en utilisant le code suivant.

$(function(){ 
    $("img[src='']").attr("src", "blank.jpg"); 
}); 
Questions connexes