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

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何使用 Javascript 從復選框獲取跨度文本?

如何使用 Javascript 從復選框獲取跨度文本?

慕的地8271018 2023-12-19 10:27:32
假設我有以下代碼:  <p>    <label>      <input name="milk" type="checkbox">      <span>Milk</span>    </label>  </p>如何使用javascript獲取span標簽之間的文本?如果登錄到控制臺,結果應為 Milk。謝謝!
查看完整描述

1 回答

?
胡說叔叔

TA貢獻1804條經驗 獲得超8個贊

您可以將 this 發送到復選框的 onclick 方法中,因此它調用的函數可以跟蹤被單擊的元素并訪問其父元素為了訪問父級的子級 span 元素。


見下文:


function printText(el) {

  console.log( el.parentNode.querySelector('span').innerHTML );

}

<p>

  <label>

    <input name="milk" type="checkbox" onclick="printText(this)">

    <span>Milk</span>

  </label>

</p>

編輯:OP詢問如果HTML無法更改怎么辦


如果無法更改 HTML,您可以通過 javascript 找到復選框和 span 元素,如下所示:


var chkBox = document.querySelector('input[type="checkbox"][name="milk"]');


chkBox.addEventListener("click", function() {

  if(this.checked) { // remove this if statement if you want it to print on every click

    console.log( this.parentNode.querySelector('span').innerHTML );

  }

});

<p>

  <label>

    <input name="milk" type="checkbox">

    <span>Milk</span>

  </label>

</p>


查看完整回答
反對 回復 2023-12-19
  • 1 回答
  • 0 關注
  • 136 瀏覽

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號