JavaScriptを使用したスパンのテキストの変更 - 「OnClick」なし

Question

私はSquarespaceを使用し、私のサイトにはテキストを変更したいボタンがあります。

私はhtmlにアクセスできませんが、 "javascript ::"スタイルのものは "button"要素で行うことができます。 Link to Image

私はthis.innerhtmlを試しましたが、動作しませんでした。

私も試してみた：

<script> 
function changeText(boxID) 
{ 
document.getElementById($(boxID).attr("id")).innerHTML = 'stuff'; 
} 
</script> 

とjavascript::changeText()を呼び出すと、それはうまくいきませんでした。

その正方形の宇宙の場所、私はIDの名前を変更することはできませんし、私はウェブサイト上の何かを変更するたびに変更されます。 ボタンのクラス名はすべてのボタンを選択するので、どちらのボタンも機能しません。

更新： この小さなリンク事でボタン：コードインジェクションのパネルでjavascript:changeText(this);

この：

<script> 
function changeText(box) 
{ 
    var boxID = box.id; 
    alert(box.id); 
    console.log('element id = ' + id); 
    document.getElementById(boxID).innerHTML = 'stuff'; 
} 
</script> 

私はあなたが行うことができ、ページの読み込み時にエラー(index):80 Uncaught TypeError: Cannot set property 'innerHTML' of null

Answer 1

を取得このような。

document.addEventListener("DOMContentLoaded", function(event) { 
    document.querySelector('.buttonclassname').innerHTML = 'New text'; 
    // or an id 
    document.querySelector('#buttonid').innerHTML = 'New text'; 
}); 

注意、特定の要素を見つけるために以下の方法はもちろん、ボタンでコメント

に基づいて更新2

---

ページのロードに使用することができますいくつかのオプションがあります。

ターゲットにするボタンがどのような方法で一意でない場合（そしてあなたは、HTMLへのアクセス権を持っている）あなたはドン場合は、インラインハンドラは」この

function changeText(elem) { 
 
    elem.innerHTML = 'New text'; 
 
}

<button onclick="changeText(this)">Old text</button> 
 
<button>Old text</button> 
 
<button>Old text</button> 
 
<button>Old text</button> 
 
<button>Old text</button>

のように接続することができますhtmlへのアクセス権があります（idやクラスのような一意性はありません）。それでも一意性があるかもしれません。

それは常に3：RDボタン、この

var btn = document.querySelectorAll("button"); 
 
if (btn.length > 2) { 
 
    btn[2].addEventListener("click", function(e) { 
 
    e.target.innerHTML = 'New text'; 
 
    }); 
 
}

<button>Old text</button> 
 
<button>Old text</button> 
 
<button>Old text</button> 
 
<button>Old text</button> 
 
<button>Old text</button>

のようなボタンが知っている一意のテキスト/ワード

Array.prototype.slice.call(document.querySelectorAll("button")).forEach(function(btn) { 
 
    btn.addEventListener("click", function(e) { 
 
    if (e.target.innerHTML.indexOf('different') > -1) { 
 
     e.target.innerHTML = 'New text'; 
 
    } 
 
    }); 
 
});

<button>Old text</button> 
 
<button>Old text</button> 
 
<button>Old text</button> 
 
<button>Old text is different</button> 
 
<button>Old text</button>