Javascript-форум - Показать сообщение отдельно - Обработать javascript''ом элементы по регепсу

cyber · #4 (**permalink**) 03.03.2013, 17:59

Zeka13,

<!DOCTYPE HTML>
<html>
  <head> </head>
  <body>

<img class="smiles" src="http://s19.rimg.info/036e2161a3108d224768fc56a4d43a8c.gif" new_src="http://upload.wikimedia.org/wikipedia/commons/thumb/3/36/Hopetoun_falls.jpg/300px-Hopetoun_falls.jpg">
<img class="smiles" src="http://s9.rimg.info/1e05da87819c011d1521b15f58557919.gif" new_src="http://upload.wikimedia.org/wikipedia/commons/thumb/3/36/Hopetoun_falls.jpg/300px-Hopetoun_falls.jpg">
 <img class="nature" src="http://wallzpoint.com/wp-content/gallery/nature_1/cool-nature-wallpapers-hd-1920x1200.jpg" width ="500" height="500" new_src="http://upload.wikimedia.org/wikipedia/commons/thumb/3/36/Hopetoun_falls.jpg/300px-Hopetoun_falls.jpg">   
    <br>
    <div id="boxes">
       <input type="checkbox" replace_class="smiles" > сменить смайлы
    <br>
    <input type="checkbox" replace_class="nature" > сменить картинку
    </div>
    <script>


      function replace_img(cls){
      
        var imgs = document.getElementsByClassName(cls),
            img,src;
        
        for(var i = 0, leng = imgs.length; i < leng;i++){
        
         img = imgs[i];
          
          src = img.getAttribute("src");
        
          img.src = img.getAttribute("new_src");
          
          img.setAttribute("new_src", src);
        
          
        }
      
       
      }      
      
      var boxs = document.getElementById("boxes");
      
      boxs.onchange = function (e){
        
       var target =  e.target || event.scrElement;
        
       if( target.type != "checkbox") return;
        var cls = target.getAttribute("replace_class");
       
        if(cls.length < 1) return;
       
        replace_img(cls);
      
      }

    </script>

  </body>
</html>