如何使用原型js更改href屬性？

Question

我有這個PHP代碼..

<?php 
     $a_source = $this->helper('catalog/image')->init($_product, 'image'); 
     $_img_a = '<a id="swapper" class="thickbox" href="'.$a_source.'" title="'.$this->htmlEscape($this->getImageLabel()).'">'; 
     $_img_b = '<img id="image" src="'.$this->helper('catalog/image')->init($_product, 'image').'" alt="'.$this->htmlEscape($this->getImageLabel()).'" title="'.$this->htmlEscape($this->getImageLabel()).'" /></a>'; 
    ?> 

我想改變使用原型HREF的價值..

$('swapper').writeAttribute('href', url); 

，但它不會改變..我失去了一些東西在這裏？謝謝！ 這裏的方式是從Magento的media.phtml整個代碼

<?php 
    $_product = $this->getProduct(); 
    $_helper = $this->helper('catalog/output'); 
    $_gallery = $this->getGalleryImages(); 

    $_resize = 350; 
?> 

<style type="text/css"> 
    .product-img-box .more-views li.slide-current a{ border:2px solid #aaa; } 
    .product-img-box .product-image-zoom img { cursor: pointer; } 
    #slide-loader{ visibility:hidden; position:absolute; top:auto; left:auto; right:2px; bottom:2px; width: 25px; height: 25px; } 
</style> 

<script type="text/javascript"> 
function slide(url,num,gallery){ 
    if (typeof slide.loading == 'undefined') slide.loading = false; 
    if(slide.loading) return false; 


    var loader = new Image(); 
    $(loader).observe('load', function(){ 
     $('slide-loader').setStyle({'visibility':'hidden'}); 

     $$('div.more-views li').each(function(el,i){ 
      (i==num) ? el.addClassName('slide-current') : el.removeClassName('slide-current'); 
     }); 

     var swap_link = new Element 
     var dummy = new Element('img', { src: url }).setOpacity(0); 
     new Insertion.After('image', dummy); 
     new Effect.Opacity(dummy, { duration:.5, from:0, to:1.0 }); 
     new Effect.Opacity($('image'), { duration:.5, from:1.0, to:0, 
      afterFinish: function(){ 

       $('image').writeAttribute('src',url).setOpacity(1).observe('click',function(){ 
        //Event.stop(e); 
        $('swapper').writeAttribute('href', url); 


       }) 
       dummy.remove(); 
       slide.loading = false; 
      } 
     }); 
    }); 

    $('slide-loader').setStyle({'visibility':'visible'}); 
    loader.src=url; 

    slide.loading = true; 
return false; 
} 
</script> 


<p class="product-image-zoom"> 

    <?php 
     $a_source = $this->helper('catalog/image')->init($_product, 'image'); 
     $_img_a = '<a id="swapper" class="thickbox" href="'.$a_source.'" title="'.$this->htmlEscape($this->getImageLabel()).'">'; 
     $_img_b = '<img id="image" src="'.$this->helper('catalog/image')->init($_product, 'image').'" alt="'.$this->htmlEscape($this->getImageLabel()).'" title="'.$this->htmlEscape($this->getImageLabel()).'" /></a>'; 
    ?> 

    <?php echo $_helper->productAttribute($_product, $_img_a.$_img_b, 'image') ?> 
    <img id="slide-loader" src="<?php echo $this->getSkinUrl('images/lightbox/loading.gif') ?>" /> 

</p> 

<?php if (count($_gallery) > 0): ?> 
<div class="more-views"> 
    <h4><?php echo $this->__('More Views') ?></h4> 
    <ul> 
    <?php foreach ($_gallery as $_image): ?> 
     <li> 
      <a href="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'image', $_image->getFile()); ?>" onclick="slide('<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'image', $_image->getFile()) ?>',<?php echo ($s = isset($s) ? ++$s : 0) ?>,'<?php echo $this->getGalleryUrl($_image) ?>'); return false;"><img src="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'thumbnail', $_image->getFile())->resize(65); ?>" alt="<?php echo $this->htmlEscape($_image->getLabel()) ?>" title="<?php echo $this->htmlEscape($_image->getLabel()) ?>" /></a> 

     </li> 
    <?php endforeach; ?> 
    </ul> 
</div> 

<?php endif; ?> 

Answer 1

它應該是setAttribute：

$('swapper').setAttribute('href', url); 

您可以直接訪問href屬性是這樣的：

$('swapper').href = url; 

Try them here.