2010-01-04 32 views
2

我抓住各種jquery對象放入數組,然後吐出爲HTML。將jQuery對象和內容轉換爲字符串?

我想將jQuery對象轉換爲文本字符串,以便稍後可以將其吐出。

我使用這種技術目前:

console.log($myObject.clone().wrap('<div></div>').html()); 

然而,只出現被抓住我的對象的內容。

例如,如果$ myObject的是<h2>My Title</h2>以上僅返回「我的標題」(無H2標籤)。

我也嘗試使用.text(),但得到相同的結果。

有沒有辦法將整個jQuery對象轉換爲文本字符串?

+0

可能重複:** [jQuery對象到字符串](HTTP://計算器。com/questions/652763)** – hippietrail 2012-10-17 14:42:34

回答

1

你在看什麼不是將JQuery對象轉換爲字符串,而是將DOM節點轉換爲其HTML表示。

在JQuery中沒有內置方法來做到這一點,也沒有什麼在Javascript中的相似。

這是一個有點乏味,但你可以,但是,重建它。 下面的代碼是不完整的,也沒有測試,但這裏的想法

var h = ''; 
$('#my_selector').each(function(){ 
    h += '<' + this.NodeName; 
    for(var k in this.attributes){ 
     h += ' ' + this.attributes[k].nodeName + '="' + this.attributes[k].value + '" '; 
    } 
    h += '>'; 
    h += this.innerHTML; 
    h += '</' + this.NodeName + '>'; 
}); 
+0

貝諾克拉波好,也許我沒有正確地提出問題。正如你從我的其他答案中看到的,我確實找到了一個解決方案,提供了我正在尋找的東西。但是,謝謝你的信息。我一直在這裏學習新的東西。另外,它看起來好像是一個方便的內置功能,可以在將來添加jQuery。我可以看到很多用途。 – 2010-01-04 16:32:09

1

從你的榜樣,你不只是需要使用call $ myObject.html()?

但是,由於我猜你以後可能不僅僅是這樣,只是將對象轉換爲JSON做這項工作?

有幾個jQuery插件可以做到這一點。一個我用過的,這一直爲我工作不錯,似乎並沒有被任何更多的,但你可以在這裏

http://jollytoad.googlepages.com/json.js

翻遍了jQuery插件庫中提供了這些2爲可能的替代

http://plugins.jquery.com/project/JSONEncoder
http://plugins.jquery.com/project/LABSJSON

我從來沒有嘗試任何一方的壽所以不能保證他們是如何有效

1
console.log($('<div></div>').append($myObject.clone()).html()); 
0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 
    <script src="Scripts/jquery-1.7.1.min.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $('#btnCreateNewDiv').click(function() { 
       $('#result').append($('<div></div>').append($('#testClone').clone()).html()); 
       $('#result div:last').show(); 
      }); 
     }); 
    </script> 
    <style type="text/css"> 
     .Clone 
     { 
      background-color: Red; 
     } 

     .Clone h1 
     { 
      color: Lime; 
     } 
    </style> 
</head> 
<body> 
    <input type="button" value="Create New Div" id="btnCreateNewDiv" /> 
    <span id="result"></span> 
    <div id="testClone" class="Clone" style="display: none;"> 
     <h1> 
      test 
     </h1> 
    </div> 
    ​ 
</body> 
</html> 
+0

現場演示請參閱此鏈接:http://jsfiddle.net/nanoquantumtech/h8WaV/ – Thulasiram 2012-04-24 10:41:51