Question

这是HTML的一个例子：

   <div id="block1">
   <div class="header">
   <span category="drink" class="uservar">TEQUILA</span>&nbsp; &nbsp; 
   <span class="block-controls" style="height:15px" contenteditable="false">
   <span title="delete block"><span placeholder="remove block" class="remove">X</span>
   </span>
   </div>
   </div>

我希望有一个选择器，可以在＆＃34; block-controls＆＃34;之前返回.header div中的所有内容。儿童。有时在＃34;块控制＆＃34;之前，标题中会有其他html元素（如上所述）。有时它只是文字（没有跨度，只有“龙舌兰酒”这个词。它需要在两种情况下都有效。

返回文本TEQUILA，但不返回span标记。

$('#block1 .header').children().not('.block-controls').html();

Answer 1

你需要的是outerHtml：

(function( jQuery, undefined ) {
    jQuery.fn.extend({
        outerHtml: function() {
            var html = "";
            this.each(function() {
                html += jQuery( "<div>" ).append(jQuery( this ).clone()).html();
            });
            return html;
        }
    });
})( jQuery );

alert($('#block1 .header').children().not('.block-controls').outerHtml());

检查这个小提琴：http://jsfiddle.net/29eBn/1/

Answer 2

这将为您提供指定的文字：

    var div = $('<div/>');
    $('#block1 .header').children().not('.block-controls').appendTo( div );
    var x = div.html();

JS FIDDLE DEMO

输出：<span category="drink" class="uservar">TEQUILA</span>

修改

代码已被编辑以删除&& this.nodeType !== 3，因为它正在寻找那些甚至不存在的节点！

演示也会更新。

根据以下评论进一步更新。

JQuery - 如何获取除一个元素之外的所有* html *元素

2 个答案: