我正在嘗試抓取一個具有如下結構的網站：
var elems = document.getElementsByClassName("breakfast");
elems = [...elems] // Converts HTMLCollection to Array
elems = elems.map(elem => elem.children[0])
elems = elems.filter(elem => elem !== undefined)
elems = elems.map(elem => elem.getAttribute("title"))
document.write(elems)<div class="breakfast">
<p title="1">Bagels</p>
</div>
<div class="breakfast">
</div>
<div class="breakfast">
<p title="2">Bread</p>
</div>
<div class="breakfast">
<p title="3">Toast</p>
</div>
<div class="breakfast">
</div>上面的 Javascript 作業得很好，但我想要這些undefined值，而不是它們不顯示，我希望它們是 0。
我的第一個想法是使用三元運算子，但是，我不知道如何創建一個新的 HTML 元素，其中可以訪問子元素或屬性等元素。我知道HTMLParagraphElement，遺憾的是檔案不足以讓我弄清楚如何做到這一點。
uj5u.com熱心網友回復：
使用 可選鏈接
可選的鏈接運算子 (
?.) 使您能夠讀取位于連接物件鏈深處的屬性值，而無需檢查鏈中的每個參考是否有效。該
?.操作是像。鏈接運算子，除了如果參考為空（空或未定義）時不會導致錯誤，運算式會短路回傳值未定義。當與函式呼叫一起使用時，如果給定的函式不存在，則回傳 undefined。
和
無效合并運算子
空合并運算子 (
??) 是一個邏輯運算子，當其左側運算元為空或未定義時回傳其右側運算元，否則回傳其左側運算元。
var elems = [...document.querySelectorAll(".breakfast")];
elems = elems.map(elem => elem.children[0])
// elems = elems.filter(elem => elem !== undefined)
elems = elems.map(elem => elem?.getAttribute("title") ?? 0)
document.write(elems)<div class="breakfast">
<p title="1">Bagels</p>
</div>
<div class="breakfast">
</div>
<div class="breakfast">
<p title="2">Bread</p>
</div>
<div class="breakfast">
<p title="3">Toast</p>
</div>
<div class="breakfast">
</div>轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/361644.html
標籤：javascript html 网页抓取