我有一個網頁作為嵌入式設備的輸入，我在操作期間更改模式。我有以下 h1 行。
<h1 id="speedlab">Speed: <span id="speedText">0</span>%</h1>
我使用一種模式更新它：-
var output = document.getElementById("speedText");
vslidertmp = (100 -(Math.abs(vslidertmp-100)/2));
vslidertmp = (vslidertmp.toFixed(0));
glslider.value = vslidertmp;
output.innerHTML = (vslidertmp - 100) ;
當我更改模式時，我想更新 h1 行以將標題文本更改為“Trim:”，并將 speedtext 內容更改為 Trim 的值。我假設更新 speedtext 是相同的，但是如何將標題文本從 Speed: 更新為 Trim: 并保持 span 元素不變。我無法計算出此語法。
uj5u.com熱心網友回復：
我將變數文本放入它自己的元素中，以便在需要時快速切換它。
<h1 id="speedlab">
<span class="mode">Speed</span>: <span id="speedText">0</span>%
</h1>
并改變它
document.querySelector('.mode').textContent = 'Trim';
雖然您也可以替換文本節點的內容，而無需更改 HTML 標記...
document.querySelector('#speedlab').childNodes[0].textContent = 'Trim: ';
給模式自己的元素更好。
uj5u.com熱心網友回復：
HTML:
header {
display: flex;
align - items: center;
/* Remove the next line if you want the span to appear next to the h1 */
justify - content: space - between;
border - bottom: 1 px solid #000;
padding: 10px 30px;
}header {
border - bottom: 1 px solid #000; }
header > h1 { display: inline-block; }
header span { margin-left: 100px; }<header>
<h1>Text</h1>
<span>text2</span>
</header>轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/400045.html
標籤：javascript html