アンカーのテキストのみを変更する

ページ上のいくつかのアンカーのテキストを変更する簡単なスクリプトを作成しようとしています。私はJavascriptの新機能ですが、アンカーを変更することはできますが、hrefを削除することを含めてタグ全体が変更されます。アンカーのテキストのみを変更する

hrefに影響を与えずにテキストのみを編集するにはどうすればよいですか？

あなたは以下のように内部の要素にクラスや要素を取得することができます 'querySelectorAll'を使用

<body> 
    <div class="loop-add-to-cart"> 
     <a href="/?preview_id=10822&#038;preview_nonce=2f9a98329f&#038;_thumbnail_id=-1&#038;preview=true&#038;add-to-cart=11544" rel="nofollow" data-product_id="11544" data-product_sku="" data-quantity="1" class="add_to_cart_button product_type_simple ajax_add_to_cart">Add to basket</a>  
     <div class="wpd-buttons-wrap-simple" data-id="11544"> 
     <a href="http://802.f5f.myftpupload.com/11550-2/design/11544/" class="mg-top-10 wpc-customize-product">Design from blank</a>     
     </div> 
    </div> 
    <script> 
     function buybuttons() { 
      var buybuttons = document.getElementsByClassName('wpd-buttons-wrap-simple'); 
      for(var i = 0; i < buybuttons.length; i++){ 
       buybuttons[i].innerHTML="Test"; 
      }; 
     } 

     buybuttons(); 
    </script> 
</body>

出典

2017-06-20 Adam Roberts

アンカーを掴む方法の例を投稿できますか？ innerHTMLを見てください - https://www.w3schools.com/jsref/prop_html_innerhtml.asp – Rastalamm

あなたは 'a'ではなく' div'の 'innerHTML'を変更しています。 'document.querySelectorAll（"。wpd-buttons-wrap-simple a "）'を使用してください：https://jsfiddle.net/khrismuc/rLrpv0n1/ –

ありがとうございました！ –

：

document.querySelectorAll('.wpd-buttons-wrap-simple > a')

出典

2017-06-20 21:12:06 Rastalamm

function buybuttons() { 
      var buybuttons = document.querySelectorAll('.wpd-buttons-wrap-simple a'); 
      for(var i = 0; i < buybuttons.length; i++){ 
       buybuttons[i].innerHTML="Test"; 
      }; 
     } 


buybuttons();

あなたは現在、div要素のinnerHTMLプロパティを上書きされますが、あなたが探していますdivの内側にアンカー要素。

これらのすべてを取得するにはdocument.querySelectorAllを使用し、最初を取得するにはdocument.querySelectorを使用します。

出典

2017-06-20 21:12:21 AnonyMouse

アンカーのテキストのみを変更する

答えて

関連する問題