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

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

無法更改按鈕單擊上的文本顏色

無法更改按鈕單擊上的文本顏色

長風秋雁 2022-09-02 21:39:14
點擊按鈕,段落沒有變色,我無法理解這背后的原因。<button onclick="changeBackGroundOfPs('#firstDiv');">Change backgrounds of p under a given element known by id</button>  <br><div id="firstDiv">  <p>First paragraph.</p>  <p>Second paragraph.</p></div>function changeBackGroundOfPs(id ) {  var paragraphs = document.querySelectorAll(id   p);  // Another way to iterate on all elements in a collection for (var i = 0; i < paragraphs.length; i++ ) {   paragraphs[i].style.backgroundColor = "lightGreen";  }}為什么這可以在查詢選擇器(document.querySelectorAll(“#” + id + “ p”)中添加分號的情況下工作);.<button onclick="changeBackGroundOfPs('firstDiv');">Change backgrounds of p under a given element known by id</button>  <br><div id="firstDiv">  <p>First paragraph.</p>  <p>Second paragraph.</p></div>function changeBackGroundOfPs(id) {  var paragraphs = document.querySelectorAll("#" + id + " p");  // Another way to iterate on all elements in a collection  for (var i = 0; i < paragraphs.length; i++ ) {    paragraphs[i].style.backgroundColor = "lightGreen";  }}
查看完整描述

1 回答

?
白板的微信

TA貢獻1883條經驗 獲得超3個贊

您的代碼中存在問題,這是正確的代碼querySelector


var paragraphs = document.querySelectorAll(`${id} p`);

下面是工作代碼。


<!DOCTYPE html>

<html>

<head>

  <meta charset="utf-8">

  <meta name="viewport" content="width=device-width">

  <title>JS Bin</title>

</head>

<body>

<button onclick="changeBackGroundOfPs('#firstDiv');">Change backgrounds of p under a given element known by id</button>

  <br>

<div id="firstDiv">

  <p>First paragraph.</p>

  <p>Second paragraph.</p>

</div>

  

  

  <script>

    console.clear();


    function changeBackGroundOfPs(id ) {


      var paragraphs = document.querySelectorAll(`${id} p`);


      // Another way to iterate on all elements in a collection

      for (var i = 0; i < paragraphs.length; i++ ) {

        paragraphs[i].style.backgroundColor = "lightGreen";

      }

    }

    

  

  </script>

</body>

</html>


查看完整回答
反對 回復 2022-09-02
  • 1 回答
  • 0 關注
  • 92 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

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

幫助反饋 APP下載

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

公眾號

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