jQuery：元素数组到原始 html？

发布于 2024-09-10 16:05:39 字数 350 浏览 6 评论 0原文

假设我有一个像这样的数组：

var content = [ $('<p>...</p>'), $('<p>...</p>') ];

我需要获取连接元素的标记。所以我需要将 content" 转换为原始字符串： "

...

”。

这怎么能轻松完成？似乎框架中应该已经有一些东西可以做到这一点。

也许可以将 content 转换为文档片段并调用 .html() 在文档片段上获取标记？

原文

Let's say I have an array like this:

var content = [ $('<p>...</p>'), $('<p>...</p>') ];

I need to get the markup of the concatenated elements. So I need to convert content" into a raw string: "<p>...</p><p>...</p>".

How can this easily be done? Seems like there should already be something in the framework to do this.

Somehow maybe convert content into a document fragment and call .html() on the document fragment to get the markup?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

唠甜嗑 2024-09-17 16:05:39

没有什么是自动的，但您可以轻松地执行您刚才描述的操作。

尝试一下： http://jsfiddle.net/Y5x5z/

var content = [ $('<p>...</p>'), $('<p>...</p>') ];

var container = $('<div/>');

$.each(content, function(i,val) {
    container.append(val);
});

alert(container.html());

Nothing automatic, but you could easily do what you just described.

Try it out: http://jsfiddle.net/Y5x5z/

var content = [ $('<p>...</p>'), $('<p>...</p>') ];

var container = $('<div/>');

$.each(content, function(i,val) {
    container.append(val);
});

alert(container.html());

回复收藏 0 原文

姜生凉生 2024-09-17 16:05:39

这比其他答案更短，工作正常，并且不使用显式循环：

[$("<p>"), $("<p>")].map(function(el){return el.get()[0].outerHTML;})

正如 Crazy Train 在评论中指出的那样，这可以按如下方式进行糖化：

var content = [ $('<p>...</p>'), $('<p>...</p>') ];

$.fn.toString = function() {
    return this[0].outerHTML
};

alert(content.join("")); // <p>...</p><p>...</p>

This is shorter than the other answers, works correctly, and does not use an explicit loop:

[$("<p>"), $("<p>")].map(function(el){return el.get()[0].outerHTML;})

As Crazy Train points out in the comments, this can be sugared-up as follows:

var content = [ $('<p>...</p>'), $('<p>...</p>') ];

$.fn.toString = function() {
    return this[0].outerHTML
};

alert(content.join("")); // <p>...</p><p>...</p>

回复收藏 0 原文

漫雪独思 2024-09-17 16:05:39

我最近遇到了相同类型的任务，今天的方法很简单：

const elements = [$('<p>...</p>'), $('<p>...</p>')];
const resultString = elements.reduce(
  (HTMLString, [element]) => HTMLString.concat(element.outerHTML),
  '',
);

请注意，reduce 中 HTMLString 的默认值是 '' 。 HTMLString 是一种能够将元素的 HTML 字符串连接到它的字符串类型，这一点很重要。

I recently encountered the same type of task and today's way of doing this is simple:

const elements = [$('<p>...</p>'), $('<p>...</p>')];
const resultString = elements.reduce(
  (HTMLString, [element]) => HTMLString.concat(element.outerHTML),
  '',
);

Notice that HTMLString's default value in reduce is ''. It's important for HTMLString to be a type of string to be able to concatenate HTML strings of elements to it.

回复收藏 0 原文

国际总奸 2024-09-17 16:05:39

这是一篇旧文章，有人可能会像我一样偶然发现它......正确的方法是 .join() （标准 JavaScript 而非 jQuery）

var content = [ $('<p>...</p>').html(), $('<p>...</p>').html() ];

var concatenatedHTML = content.join('');

//concatenatedHTML would then be '<p>...</p><p>...</p>'

This is an old post someone may stumble upon it like me... the correct way to do it would be .join() (standard JavaScript not jQuery)

var content = [ $('<p>...</p>').html(), $('<p>...</p>').html() ];

var concatenatedHTML = content.join('');

//concatenatedHTML would then be '<p>...</p><p>...</p>'

回复收藏 0 原文

~没有更多了~