如何在瀏覽器控制檯中通過javascript替換<a>標記不同的值？

Question

我想用不同的值javascript來代替的東西：

，所以我選擇的標籤路徑，並通過獲取它：

document.querySelector('#2311 > div._20bp > div._4_j4 > div:nth-child(2) > div._4rv3 > div > div._4rv4 > a'); 

標籤看起來是這樣的：

<a aria-label="wow" class="_5j_u _4rv9 _30yy _39bl" role="button" title="wow" href="#"><svg aria-labelledby="js_ib" version="1.1" viewBox="-1 -1 40.16 42.24" preserveAspectRatio="xMinYMax meet" style="height: 85%; width: 66%;"><title id="js_ib">Thumbs-up sign</title><path d="M935.36,1582.44a0,0,0,0,0,0,.06,3.59,3.59,0,0,1-.72,6.53,0,0,0,0,0,0,0,3.56,3.56,0,0,1,.71,2.13,3.6,3.6,0,0,1-3,3.54, 0,0,0,0,0,0,.05,3.56,3.56,0,0,1,.38,1.61,3.61,3.61,0,0,1-3.42,3.6H910v-19.6l5.27-7.9a4,4,0,0,0,.66-2.31l-0.1-4c-0.22-2.4-.09-2.06, 1.13-2.37,2-.51,7.16,1.59,5.13,12.17h11.06A3.59,3.59,0,0,1,935.36,1582.44ZM899,1581h7v22h-7v-22Z" transform="translate(-898.5 -1563.26)" fill="transparent" fill-rule="evenodd" stroke="#13CF13" stroke-linecap="round" stroke-width="5%"></path></svg></a> 

我想將此標籤替換爲：

<a data-hover="tooltip" data-tooltip-content="Press" class="_30yy _38lh _39bl" href="#" style="color: rgb(19, 207, 19);">Send</a> 

iw螞蟻在javascript瀏覽器控制檯上做到這一點

該怎麼做？

我想：

document.querySelector('#2311 > div._20bp > div._4_j4 > div:nth-child(2) > div._4rv3 > div > div._4rv4 > a').style="<a data-hover="tooltip" data-tooltip-content="Press" class="_30yy _38lh _39bl" href="#" style="color: rgb(19, 207, 19);">Send</a>" 

但沒有奏效。

Answer 1

嘗試使用.outerHTML像這樣：

document.querySelector('#2311 > div._20bp > div._4_j4 > div:nth-child(2) > div._4rv3 > div > div._4rv4 > a').outerHTML = '<a data-hover="tooltip" data-tooltip-content="Press" class="_30yy _38lh _39bl" href="#" style="color: rgb(19, 207, 19);">Send</a>'; 

你可以閱讀更多關於它的MDN。