Есть ли способ записать фактический DOM в строку - PullRequest
Новая
       1

Есть ли способ записать фактический DOM в строку

2 голосов
/ 21 июля 2011

У меня есть HTML-документ 

<html>
<head></head>
<body>
<form>
<input type="text" value="" />
</form>
<input type="button" id="doit" value="do it"/>
    <!-- jQuery -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js">
        </script>            
        <script type="text/javascript">
        $(document).ready(function() {
            $("#doit").click(function(){
            var dom = document.documentElement.innerHTML;
            alert(dom);
            });
        });
        </script>
</body>
</html>

если я редактирую текстовое поле, его значение все еще остается исходным пустым значением в предупреждении ... ПОЧЕМУ? и как я вижу фактический DOM в строке?

Ответы [ 2 ]

3 голосов
/ 21 июля 2011

Вам необходимо явно установить каждый атрибут с текущим значением: http://jsfiddle.net/GW8eU/.

$("#doit").click(function(){
    $('*').each(function() {
        var $this = $(this);
        for(var i = 0; i < this.attributes.length; i++) {
            try {
                var t = this.attributes[i];
                $this.attr(t.name, $this.prop(t.name));
            } catch(e) {}
        };
    });
    var dom = document.documentElement.innerHTML;
    alert(dom);
});

Это довольно грязно, и я не вижу реального обоснования для вывода DOM в строку, но, похоже, он отвечает на ваш вопрос.

Одна из причин, по которой он грязный, заключается в том, что блок try важен, потому что в противном случае вы бы установили атрибут type для input, который является неизменным. Я почти уверен, что это не будет работать и с другими специальными атрибутами, но для value из input он работает нормально.

Поэтому я все еще хотел бы знать, в чем причина того, что DOM является строкой; возможно, есть более элегантное решение.

1 голос
/ 21 июля 2011

Я не знаю, почему вы хотите это сделать, единственная причина, о которой я могу подумать, это какой-то WYSIWYG-редактор, с которым взаимодействует пользователь, а затем может получить исходный код HTML из этого?Если это так, то я не думаю, что вы сможете достичь этого.

Если все, что вам нужно, это получить значение поля ввода, а не получать HTML-страницы целиком, выВы можете получить значение для ввода, указав свой идентификатор: 

<input type="text" value="" id="input_field" />

и используя: 

var value = document.getElementById("input_field").value;

Или в jQuery: 

var value = $("#input_field").val();

В качестве альтернативы,если вы хотите иметь возможность просматривать DOM, как он изменяется с помощью javascript, то я рекомендую Firebug для Firefox, Инструменты разработчика для Chrome / Safari или Панель инструментов разработчика для IE .Это позволит вам просматривать DOM в том виде, в котором он хранится в памяти браузера после внесения изменений в javascript или пользователем.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...