页面加载时<a>标签的Javascript更新href

时间:2021-07-28 16:14:56

标签: javascript

我写了一个看起来像这样的代码。我应该更新包含我想要更改的 url 的标签的每个 href。

<script>
   var url = window.location.href;
   myArr = url.split("?");
   myArr[0] = "mynewurl";
   new_url = myArr.join("#");

   $(document).ready(function(){

          $(".item a[href='myoldurl']").prop("href", new_url);

   });
   </script>

不幸的是,href 总是相同的。 这是包含我的标签的按钮。

<div class="de elBTN elAlign_center elMargin0 ui-droppable de-editable" id="tmp_button-57701" data-de-type="button" data-de-editing="false" data-title="button" data-ce="false" data-trigger="none" data-animate="fade" data-delay="500" style="margin-top: 30px; outline: none; cursor: pointer;" data-element-theme="customized" data-elbuttontype="1" aria-disabled="false">
<a href="https://pietroscataglini.typeform.com/to/c4dAZYjg" class="elButton elButtonSize1 elButtonColor1 elButtonRounded elButtonPadding2 elButtonFluid elButtonBlock elButtonCorner5 elBTNone elBtnVP_10 elBtnHP_20 elBTN_b_none elButtonShadow3 elButtonTxtColor1 deneg1pxLetterSpacing ea-buttonPulseGlow mfs_20" style="color: rgb(255, 255, 255); background: rgb(55, 149, 128); font-size: 20px;" rel="noopener noreferrer">
<span class="elButtonMain"><i class="fa_prepended fas fa-angle-double-right" contenteditable="false"></i>“Voglio diventare un Copywriter!"<i class="fa_appended fas fa-angle-double-left" contenteditable="false"></i></span>
<span class="elButtonSub mfs_14" style="font-size: 18px;">Compila il questionario per accedere alla consulenza gratuita introduttiva</span>
</a>
</div>

这是标签:

<a href="myoldurl" class="elButton elButtonSize1 elButtonColor1 elButtonRounded elButtonPadding2 elButtonFluid elButtonBlock elButtonCorner5 elBTNone elBtnVP_10 elBtnHP_20 elBTN_b_none elButtonShadow3 elButtonTxtColor1 deneg1pxLetterSpacing ea-buttonPulseGlow mfs_20" style="color: rgb(255, 255, 255); background: rgb(55, 149, 128); font-size: 20px;" rel="noopener noreferrer">
<span class="elButtonMain"><i class="fa_prepended fas fa-angle-double-right" contenteditable="false"></i>“Voglio diventare un Copywriter!"<i class="fa_appended fas fa-angle-double-left" contenteditable="false"></i></span>
<span class="elButtonSub mfs_14" style="font-size: 18px;">Compila il questionario per accedere alla consulenza gratuita introduttiva</span>
</a>
     

2 个答案:

答案 0 :(得分:1)

你可以这样做

    let anc = document.getElementsByTagName('a');
    for (const ancr of anc) {
        if (ancr.href.includes('myoldurl')) {
            const ahref = ancr.href.replace('myoldurl', 'mynewurl');
            ancr.href = ahref;
        }
    }

答案 1 :(得分:1)

您不需要在查询选择器中 .item 类名,因为您的 <a> 元素没有这个类。试试这个。

btn.onclick = function changeUrl () {
  var newUrl = "https://pietroscataglini.typeform.com/to/c4dAZYjg";
  /*
  var myArr = url.split("?");
  myArr[0] = "mynewurl";
  var new_url = myArr.join("#");
  */

  $("a[href='myoldurl']").prop("href", newUrl);
  $("#message").text(newUrl);
}
#message {
 color: red
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="de elBTN elAlign_center elMargin0 ui-droppable de-editable" id="tmp_button-57701" data-de-type="button" data-de-editing="false" data-title="button" data-ce="false" data-trigger="none" data-animate="fade" data-delay="500" style="margin-top: 30px; outline: none; cursor: pointer;" data-element-theme="customized" data-elbuttontype="1" aria-disabled="false">
  <a href="myoldurl" class="elButton elButtonSize1 elButtonColor1 elButtonRounded elButtonPadding2 elButtonFluid elButtonBlock elButtonCorner5 elBTNone elBtnVP_10 elBtnHP_20 elBTN_b_none elButtonShadow3 elButtonTxtColor1 deneg1pxLetterSpacing ea-buttonPulseGlow mfs_20" style="color: rgb(255, 255, 255); background: rgb(55, 149, 128); font-size: 20px;" rel="noopener noreferrer">
    <span class="elButtonMain"><i class="fa_prepended fas fa-angle-double-right" contenteditable="false"></i>“Voglio diventare un Copywriter!"<i class="fa_appended fas fa-angle-double-left" contenteditable="false"></i></span>
    <span class="elButtonSub mfs_14" style="font-size: 18px;">Compila il questionario per accedere alla consulenza gratuita introduttiva</span>
  </a>
</div>
<br>
Now <b>href</b> value is <span id="message">"myoldurl"</span>. 
<br>When you click on the button it will replace with your new url.
<br>
<input type="button" id="btn" value = "Change">

相关问题