Question

我想使用css选择器从html页（参见下文）中选择一些信息，例如“ Room1”，“ Room2”，“ Room3”，并打印出来“该怎么办？” ：

                <div class="bloco-imovel-resumo-dados">
                    <div id="Cpl_modulodadosresumidos_module_holder" class="modulo-dados-resumidos">

<h2 class="lbl_descricao_dados"> My Information</h2>

<ul class="bloco-dados">

    <li>
        <b>Room1:</b> <span>Renewed</span></li>
    <li>
        <b>Room2:</b><span> 30 m<sup>2</sup></span></li>
    <li>
        <b>Room3:</b><span> 2 m<sup>2</sup></span></li>
    <li>
        <b>Room4:</b><span> 4 </span></li>
    <li>
        <b>Room 5:</b><span> 5 </span></li>

</ul>

Answer 1

您可以使用以下

Nodes = document.querySelectorAll(".bloco-dados li")
Data = [] // new array
for (I = 0; I < Nodes.length; I++) {
    DataName = Nodes[I].firstChild.innerText // <b> tag is the first child node of <li> tag
    DataName = DataName.substr(0, DataName.length - 1) // Remove last character (the colon)
    DataValue = Nodes[I].lastChild.innerText // <span> tag is the last child node of <li> tag
    Data[DataName] = DataValue
}
alert(Data["Room 1"])
alert(Data["Room 2"])
alert(Data["Room 3"])
alert(Data["Room 4"])
alert(Data["Room 5"])

使用CSS选择器从HTML页面提取信息

1 个答案: