首先,我對 javascript 不太熟悉,但我知道一點。我所在的平臺正在運行我在后端看不到的代碼。這意味著我只能控制這么多。例如有一個標簽:{{ component.quality_switch }}當頁面加載時,它會將其替換為:<div class="co-quality-switch" data-behavior="quality_switch"> <a class="co-quality-switch" href="#" data-behavior="switch-low" style=""> <i class="co-icon-video-camera"></i> watch in high quality </a></div>我的目標是將“a”鏈接的文本從“高質量觀看”替換為“切換字幕”。因此,我進行了實驗,刪除了第一個 {{component.quality_switch}} 標簽,并將其替換為通常拉取的外部 div,并在 div 中添加了 ID:<div id="captiontoggle" class="co-quality-switch" data-behavior="quality_switch"></div>當頁面加載時,它像以前一樣返回,并在 div 上添加了我的 id。進步!<div id="captiontoggle" class="co-quality-switch" data-behavior="quality_switch"> <a class="co-quality-switch" href="#" data-behavior="switch-low" style=""> <i class="co-icon-video-camera"></i> watch in high quality </a></div>顯然,后端的data-behavior="quality_switch"部分有一些 java 添加了所有這些代碼。更重要的是,我需要該數據行為命令附帶的所有其他內容,因為這就是在單擊時將我的視頻源交換到字幕版本并返回的內容。所以我無法刪除它。所以我的下一個想法是讓我們使用 JS 來更改該“a”鏈接的innerHTML。內部HTML是:<i class="co-icon-video-camera"></i>watch in low quality因此,如果我可以將其替換為“切換字幕”,我就一切就緒了。但是,當“a”鏈接沒有 ID 時,如何交換它的innerHTML?我只能將 ID 分配給它的父 DIV (captiontoggle)。我嘗試添加這個腳本:<script>var x = document.getElementById("captiontoggle");var y = x.getElementsByTagName("a");y.innerHTML = "test";</script>...但這并沒有改變任何事情。從我的實驗看來,我可能無法在下面兩層執行此操作...就像我可以更改captiontoggle的innerHTML,但不是它的“a”元素。我愿意接受建議!謝謝。
1 回答

慕容708150
TA貢獻1831條經驗 獲得超4個贊
您需要使用父引用來獲取子項并在那里進行更改innerHTML
<script>
var x = document.getElementById("captiontoggle");
var y = x.children[0];
y.innerHTML = "test";
</script>
工作片段:
var x = document.getElementById("captiontoggle");
var y = x.children[0];
y.innerHTML = "test";
<div id="captiontoggle" class="co-quality-switch" data-behavior="quality_switch">
<a class="co-quality-switch" href="#" data-behavior="switch-low" style="">
<i class="co-icon-video-camera"></i> watch in high quality
</a>
</div>
- 1 回答
- 0 關注
- 94 瀏覽
添加回答
舉報
0/150
提交
取消