Использование jQuery для эхо-текста

Можно ли использовать jQuery для эхо-текста вместо тега script? Точнее, есть ли способ выполнить

<script type="text/javascript">
    document.write("foo");
</script>

... без использования document.write? Мне не нравится использовать document.write после прочтения этого.

Я знаю, что я мог бы это сделать:

<span id="container"></span>
<script type="text/javascript">
    $("#container").text("foo");
</script>

Однако мне интересно посмотреть, есть ли способ сделать это, не используя элемент контейнера, предпочтительно используя jQuery.

Спасибо заранее!

Ответ 1

Да и Нет. Для чего вы хотите, нет.

Можете ли вы передать эхо-текст чему-то без подлинного контейнера, да (см. DocumentFragment).
Будет ли он отображаться в вашем документе... нет. Это объясняется тем, что ему не было рассказано, куда его следует поместить. Теги script в html не сохраняют свою позицию как параметр напрямую, поэтому вы можете искать новый тег и помещать там TextNode, однако это может быть затруднительным и ошибочным.

То, что вы можете сделать вместо этого, - это общая практика, не изменяющая dom до события, такого как document.body.onLoad. Это обычная практика, и, как правило, это лучший способ для аякса.

Если это не подходит для вас, используйте редкую функцию insertBefore(), jquery обеспечивает сопоставимую поддержку с .after и .before в вашем элементе script с идентификатором.

<script id="flail">
var flail=document.getElementById("flail");
flail.parentNode.insertBefore(document.createTextNode("TEST"),flail)
</script>

Примечание. Это, как правило, плохая практика, так как она может создавать зависающие нагрузки и поощряет html-страницу не быть последовательной без этого вывода. Однако, как и все, есть случаи, когда они используются.

Ответ 2

Если вы придумаете способ jQuery делать document.write(), это будет плохо по тем же причинам.

Вам лучше использовать document.write(), если это то, что вам нужно, или еще лучше, манипулировать существующим элементом или добавить новый элемент где-то в DOM - то, что подходит jQuery.

Ответ 3

Я предлагаю вам внедрить Micro Template Engine John Resig, основатель jquery.

Полный плагин

// Simple JavaScript Templating
// John Resig - http://ejohn.org/ - MIT Licensed
(function() {
    var cache = {};

    this.tmpl = function tmpl(str, data) {
        // Figure out if we're getting a template, or if we need to
        // load the template - and be sure to cache the result.
        var fn = !/\W/.test(str) ?
                cache[str] = cache[str] ||
                tmpl(document.getElementById(str).innerHTML) :
                // Generate a reusable function that will serve as a template
                // generator (and which will be cached).
                new Function("obj",
                "var p=[],print=function(){p.push.apply(p,arguments);};" +
                // Introduce the data as local variables using with(){}
                "with(obj){p.push('" +
                // Convert the template into pure JavaScript
                str
                .replace(/[\r\t\n]/g, " ")
                .split("<%").join("\t")
                .replace(/((^|%>)[^\t]*)'/g, "$1\r")
                .replace(/\t=(.*?)%>/g, "',$1,'")
                .split("\t").join("');")
                .split("%>").join("p.push('")
                .split("\r").join("\\'")
                + "');}return p.join('');");

        // Provide some basic currying to the user
        return data ? fn(data) : fn;
    };
})();

Использование

ВАЖНО: Разделите строки только с помощью \

var tpl = '\
    <div id="myTemplate">\
        <%\ var selectorIndex = 0;\ %>\
           <ul>\
                <% if( selectorIndex == 0 ){ %>\
                <li>this is echo text for zero</li>\
                <% } else{ %>\
                <li>this is echo text for something else</li>\
                <% } %>\
           </ul>\
    </div>\
';

$(body).html(tmpl(tpl,{'extraData':'here'}));

Дополнительная информация

http://krasimirtsonev.com/blog/article/Javascript-template-engine-in-just-20-line

Связанные вопросы о stackoverflow

Синтаксическая ошибка с Micro Templating от Джона Ресига после изменения тегов шаблонов < # {% {{etc