在 javascript 中获取 div 内的值

Question

我正在尝试获取 div 内的值，因为有嵌套的 div 我不知道如何获取该值。 这是一个示例，我想获取“Pennsylvanian”并将其存储在一个变量中。

<div id="map" onclick="mapzoom()" class="leaflet-container leaflet-touch leaflet-retina leaflet-fade-anim leaflet-grab leaflet-touch-drag leaflet-touch-zoom" tabindex="0">
  <div class="leaflet-pane leaflet-map-pane">
  <div class="leaflet-pane leaflet-tile-pane">
  <div class="leaflet-layer>
  <div class="leaflet-tile-container leaflet-zoom-animated">
  <div class="leaflet-popup-content" style="width: 78px;">
  <a href="https://en.wikipedia.org/wiki/Global_Boundary_Stratotype_Section_and_Point" target="_blank"> Pennsylvanian
 </a>
 </div>
 </div>
 </div>
 </div>
 </div>
 </div>

Answer 1

如果这是页面中唯一的<a> ，您可以在querySelector和innerText的帮助下执行此操作，如下所示：

 const anchorTag = document.querySelector("a") const text = anchorTag.innerText console.log(text)

 <div id="map" onclick="mapzoom()" class="leaflet-container leaflet-touch leaflet-retina leaflet-fade-anim leaflet-grab leaflet-touch-drag leaflet-touch-zoom" tabindex="0"> <div class="leaflet-pane leaflet-map-pane"> <div class="leaflet-pane leaflet-tile-pane"> <div class="leaflet-layer"> <div class=" leaflet-tile-container leaflet-zoom-animated "> <div class="leaflet-popup-content " style="width: 78px; "> <a href="https://en.wikipedia.org/wiki/Global_Boundary_Stratotype_Section_and_Point " target="_blank "> Pennsylvanian </a> </div> </div> </div> </div> </div> </div>

但是，如果您有其他一些<a> ，则必须为其分配一个唯一的id并通过该id获取其值。 然后你像以前一样使用document.querySelector("#nameOfId")或document.getElementbyId("nameOfId")获得元素。

 const anchorTag = document.getElementById("anchorTag") const text = anchorTag.innerText console.log(text)

 <div id="map" onclick="mapzoom()" class="leaflet-container leaflet-touch leaflet-retina leaflet-fade-anim leaflet-grab leaflet-touch-drag leaflet-touch-zoom" tabindex="0"> <div class="leaflet-pane leaflet-map-pane"> <div class="leaflet-pane leaflet-tile-pane"> <div class="leaflet-layer"> <div class=" leaflet-tile-container leaflet-zoom-animated "> <div class="leaflet-popup-content " style="width: 78px; "> <a id="anchorTag" href="https://en.wikipedia.org/wiki/Global_Boundary_Stratotype_Section_and_Point " target="_blank "> Pennsylvanian </a> </div> </div> </div> </div> </div> </div>