Преобразовать объект и содержимое jQuery в строку? - PullRequest
2 голосов
/ 04 января 2010

Я собираю различные объекты jquery для помещения в массив, а затем выкладываю их в виде HTML.

Я пытаюсь преобразовать объект jQuery в текстовую строку, чтобы позже ее можно было выложить в виде HTML.

Я сейчас использую эту технику:

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

Однако, кажется, что это только захватывает содержимое моего объекта.

Например, если $ myObject равен <h2>My Title</h2>, приведенное выше возвращает только «My Title» (без тегов H2).

Я также пытался использовать .text (), но получил тот же результат.

Есть ли способ преобразовать весь объект jQuery в текстовую строку?

Ответы [ 5 ]

5 голосов
/ 04 января 2010

Ну, отвечая на мой вопрос.

console.log($('<div>').append($myObject.clone()).remove().html());

Спасибо Джону Феминелле в этой теме:

Как преобразовать объект jQuery в строку?

кто ссылается на этот пост:

http://jquery -howto.blogspot.com / 2009/02 / как к получить набитый-HTML-струнной-including.html

1 голос
/ 24 апреля 2012
 console.log($('<div></div>').append($myObject.clone()).html());
1 голос
/ 04 января 2010

Из вашего примера, вам не нужно просто использовать 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 голос
/ 04 января 2010

Вы ищете не для преобразования объекта 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 голосов
/ 24 апреля 2012
<!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>
...