如何在squarepace上添加JavaScript代碼注入以更改href屬性？

Question

我想通過插入代碼注入來更改我的squarespace網站上的鏈接。我添加了以下代碼：

<script> 
    var element = document.getElementsByClassName('eventitem-backlink')[0]; 
    element.setAttribute('href', '/archive/2017'); 
</script> 

但是，這不起作用，因爲元素未定義。 document.getElementsByClassName調用返回一個包含我想要編輯的元素的長度列表，但是當我嘗試提取它時，它是未定義的。

當我運行下面的代碼：

console.log(document.getElementsByClassName('eventitem-backlink')); 
console.log(document.getElementsByClassName('eventitem-backlink')[0]); 

它產生如下：

Answer 1

你在這個過程中過早地調用該函數。嘗試：

<script> 
 
    (function() { 
 

 
    function fn() { 
 
     var element = document.getElementsByClassName('eventitem-backlink')[0]; 
 

 
     if (element) { 
 
     console.log('element found'); 
 
     element.setAttribute('href', '/archive/2017'); 
 
     } else { 
 
     console.log('element not found yet');  
 
     setTimeout(fn, 200); 
 
     } 
 
    } 
 

 
    fn(); 
 
    })(); 
 
</script>