首頁猿問如何在 Javascript...

如何在 Javascript 中重寫選項的文本？

JavaScript

慕神8447489 2023-06-09 17:43:51

我遇到了一個問題：我不知道如何重寫選擇中選項的（內部）文本。我的目標是這樣的：<select id="example-dropdown"> <option id="option-id" value="example-option">Example</option></select><button id="change-option-text-btn" onclick="document.querySelector('#option-id').innerText = 'Example 2'">Click Me</button>我知道這可能是重復的，但我找到的所有答案都不適合我（我也找到了一些 jQuery 的，我不知道它們是否都不起作用），例如：document.querySelector("#example-dropdown").options[0].text = "Example 2"沒有遇到任何錯誤信息。編輯：好的，對不起，我沒有說：這只是一個示例代碼，onclick 只是為了節省時間

查看完整描述

1 回答

慕絲7291255

TA貢獻1859條經驗獲得超6個贊

好吧，您當前的代碼存在一些問題，我將在此處簡要指出。

首先，最好在代碼中堅持不顯眼的<script>解決方案，并在JS 文件或 JS 文件中處理所有邏輯，而不是在 HTML 本身中處理它們。因此，為此，我只是onclick從 HTML 中刪除了處理程序并將其移動到 JS 部分，并嘗試訪問該元素并通過addEventListener方法向其添加事件。
如果您在查詢選擇器中選擇了正確的元素，您的第一個片段應該會按預期工作，因此您可以將選擇器更改為document.querySelector('#example-dropdown option[value=example-option]')，但是由于innerText缺點，最好根本不要使用它來更改元素的內部文本。
如果您不想使用innerText它的缺點，可以使用innerHTMLortextContent屬性來更改 HTML 標記的內容。這就是你的情況，因為你只是想單獨更改你需要使用的選項的文本textContent。

你的最終代碼應該是這樣的：

const btn = document.querySelector('#change-option-text-btn');

const select = document.querySelector('#example-dropdown');

btn.addEventListener('click', function() {

? select.options[0].textContent = 'Example 2'

});

? <option value="example-option">Example</option>

</select>

<button id="change-option-text-btn">Click Me</button>

此外，在您的特定情況下，由于您正在嘗試更改選擇選項的內部文本，因此您還有一個選擇，因為您之前嘗試過的是使用與texts?.textContentHTMLOptionElement

^{所以，document.querySelector("#example-dropdown").options[0].text應該為你做的工作。}

它將是這樣的：

const btn = document.querySelector('#change-option-text-btn');

const select = document.querySelector('#example-dropdown');

btn.addEventListener('click', function() {

? select.options[0].text = 'Example 2'

});

? <option value="example-option">Example</option>

</select>

<button id="change-option-text-btn">Click Me</button>

反對回復 2023-06-09

1 回答
0 關注
124 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

如何在 Javascript 中重寫選項的文本？

如何在 Javascript 中重寫選項的文本？

1 回答

添加回答

如何在 Javascript 中重寫選項的文本？

如何在 Javascript 中重寫選項的文本？