Question

我正在尝试获取具有内部元素的Element的内部html

  <span> Hello How <span>a</span> re You</span>

我只想获取你好你怎么样但是我会这样：

   Hello How <span>a</span> re You

这是我的javascript代码：

  <script>

      $(document).ready(function(){

         var spans = document.getElementsByTagName("span");
          for(i=0;i<spans.length;i++){


              alert(spans[i].innerHTML);
          }


      });


  </script>

谁能告诉我怎么解决这个问题？ THANKYOU

Answer 1

您可以克隆element然后删除子元素并获取内容或过滤内部内容

＆＃13;

 $(document).ready(function() {

   var $spans = $("span");
   //first way
   $spans.each(function() {
     var text = $(this).clone().find('*').remove().end().text();
     snippet.log('1: ' + text)
   });

   //second way
   $spans.each(function() {
     var text = $(this).contents().filter(function() {
       return this.nodeType == Node.TEXT_NODE;
     }).text();
     snippet.log('2: ' + text)
   })



 });

＆＃13;

<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span> Hello How <span>a</span> re You</span>

＆＃13;

Answer 2

以jquery的方式。

      $(document).ready(function(){
           var spans = document.getElementsByTagName("span");
          for(i=0;i<spans.length;i++){
             alert($(spans[i]).text()); // Changed here
          }
 });

Jsfiddle using jQuery

使用javascript

$(document).ready(function(){

         var spans = document.getElementsByTagName("span");
          for(i=0;i<spans.length;i++){
             alert(spans[i].textContent); // Using textContent
          }
 });

jsfiddle with javascript

评论后

编辑如果您只查找“Hello How a re You”，则只需要首先检索文本表单NodeList。

以jquery方式

$(document).ready(function(){
 var sp = $('span');
         alert($(sp[0]).text())
 });

Jsfiddle

Answer 3

你可以这样做

alert($("span")[0].innerHTML.replace(/<(?:.|\n)*>/gm, ''));

<span> Hello How <span>a</span> re You</span>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Javascript只选择外部元素的内部html，不包括内部元素

3 个答案: