2016-04-09 68 views
1

我想獲取所有span標籤的HTML,但我只能獲取內部HTML。這是我的代碼:Jquery無法獲取元素html

var spans = document.getElementsByTagName('span'); 
for(var i=0;i<spans.length;i++) { 
    alert($(spans[i]).html()); 
} 

這隻會打印標籤內的文本,而不是打印標籤。我怎樣才能打印標籤?

+0

能否請您提供codepen或的jsfiddle? – HenryDev

回答

1

var spans = $("span"); 
 
spans.each(function(index,element){ 
 
    alert(element.outerHTML); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 
 
<span>Hallo</span>

您可以使用outerHTML和jQuery。希望它可以幫助

1

使用outerHTML

for (var i = 0; i < spans.length; i++) { 
    alert(spans[i].outerHTML); 
} 

DEMO

0

那裏有兩種方式來抓住你的頁面上的所有span元素。

本地JavaScript

var spans = document.getElementsByTagName('span'); 
for (var i in spans){ 
    //print out the whole tag 
    console.log(spans[0].outerHTML); 
} 

jQuery的

var spans = $('span'); 
spans.each(function(index,elem){ 
    //print out the whole tag 
    console.log(elem.outerHTML); 
}); 

代替使用警報這是惱人的,使用的console.log(跨距);並打開您的Web瀏覽器控制檯以查看打印出的內容。

編輯:第一張海報是正確的,outerHTML是要走的路。

+0

但我沒有任何區別 – Jois

+0

而你實際上並沒有回答這個問題...... – Andy

+0

OP提到了獲取所有span標籤的html並保持標籤連接。我認爲這就是代碼的含義,否則我就會迷失方向。 – Sparky256

0
var spans = document.getElementsByTagName('span'); 

     for(var i=0;i<spans.length;i++){ 


      alert(  +'<span> '+ $(spans[i]).html())+' </span>'; 
     } 
    } 

只是添加了一些硬編碼的'書擋'標題'跨度'。您可以根據需要修改它們。
它們充當您的html的包裝,並在循環的每次迭代中運行。

0

這裏是另一種方式來做到這一點:

var spans = $('span'); 
 
    spans.each(function(index,element){ 
 
     alert($('<div/>').html(element).html()); 
 
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 
 
<span>Hallo</span>