如何在div标签内获取跨度内部文本

时间:2019-11-05 02:46:44

标签: javascript sharepoint powerapps

  

在powerpoint页面中嵌入powerapps表单。我在powerapps中有一个下拉框。在基于下拉值的共享点页面中,我想显示一些代码。从下面的代码,我想亚太地区的文本。这里的html代码是在浏览器中动态生成的。

     

这是我在浏览器中生成的HTML代码。

<div data-is-focusable="true" id="react-combobox-view-0" class="label_kohvda-o_O-label_2lsolt" tabindex="9" role="listbox" aria-expanded="false" aria-haspopup="true" aria-atomic="true" title="Region" aria-live="assertive">

<div style="width: 100%; overflow: hidden; position: relative; display: flex; height: 100%; align-items: stretch;">
<ul style="margin: 0px; padding: 5px; list-style: none; display: flex; overflow: hidden;">
<li class="selectedItem_1og5q2j">
<span class="topTagText_yz2uri-o_O-topTagText_t9v74o-o_O-topTagTextReadonly_ps5463">APAC</span></li></ul></div>

<div class="combobox-view-chevron arrowContainer_1kmq8gc-o_O-container_r2h174-o_O-containerColors_1803dea"></div></div>

2 个答案:

答案 0 :(得分:0)

使用JavaScript如果您具有动态生成的元素类,则可以执行以下操作: document.querySelector('.label_kohvda-o_O-label_2lsolt span.topTagText_yz2uri-o_O-topTagText_t9v74o-o_O-topTagTextReadonly_ps5463')

如果没有元素类,则可以根据html进行操作:

const span = document.querySelector('div div ul li span')

console.log(span.innerText)
<div data-is-focusable="true" id="react-combobox-view-0" class="label_kohvda-o_O-label_2lsolt" tabindex="9" role="listbox" aria-expanded="false" aria-haspopup="true" aria-atomic="true" title="Region" aria-live="assertive">

  <div style="width: 100%; overflow: hidden; position: relative; display: flex; height: 100%; align-items: stretch;">
    <ul style="margin: 0px; padding: 5px; list-style: none; display: flex; overflow: hidden;">
      <li class="selectedItem_1og5q2j">
        <span class="topTagText_yz2uri-o_O-topTagText_t9v74o-o_O-topTagTextReadonly_ps5463">APAC</span>
      </li>
    </ul>
  </div>

  <div class="combobox-view-chevron arrowContainer_1kmq8gc-o_O-container_r2h174-o_O-containerColors_1803dea"></div>
</div>

答案 1 :(得分:0)

我们可以使用jQuery来实现它。

<script src="https://code.jquery.com/jquery-1.12.4.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
    var region=$("div[title='Region'] li[class^='selectedItem']").text();
    alert(region);
});
</script>

<script src="https://code.jquery.com/jquery-1.12.4.min.js" type="text/javascript"></script>
<script type="text/javascript">
var myVar;
$(function () {         
    myVar = setInterval(getDropdownValue, 100);
});
function getDropdownValue(){
    if($("div[title='Region'] li[class^='selectedItem']").length>0){
        var region=$("div[title='Region'] li[class^='selectedItem']").text();
        alert(region);
        clearInterval(myVar);
    }   
}
</script>