用jQuery更改嵌套在隨機html元素內的html元素

Question

我有一個JQuery函數，可在充滿DIV的頁面中隨機選擇一個DIV。 我正在嘗試修改該函數，以便它檢查嵌套在隨機DIV中的H3標簽的長度。 如果H3標簽內的字符串超過10個字符長（包括空格），則該函數應截斷該字符串，並用此新的較短字符串替換H3的內容並顯示它。

示例：（jquery）

if ($('#main').length !== 0) {
    var new_item = $('#main div').eq(Math.floor(Math.random() * $('#main div').length));    
    new_item.css('display','block');
}

（HTML檔案）

<div id="main">
  <div id="m1" style="display:none;">
    <h3>Apples are red</h3>
  </div>
  <div id="m2" style="display:none;">
    <h3>Oranges are orange</h3>
  </div>
  <div id="m3" style="display:none;">
    <h3>Bananas are yellow</h3>
  </div>
</div>

（所需的輸出-如果隨機選擇DIV＃m2，用戶會看到什么）

橘子ar

Answer 1

$(new_item).find('h3').text($(new_item).find('h3').text().substr(0,10));

Answer 2

您已經有獲取隨機div元素的代碼。 您要添加的部分相當簡單：

var h3_item = new_item.children("h3");
h3_item.html(h3_item.html().substring(0, 10));