0

So I have something like this:

<span class="a"> Contents <span class="b">Herp</span><br></span>

...where the "contents" may vary from a string, to a single image to multiple linebreaks. I need to define the "contents" as a variable without getting the b.span and br.

How do you do it? Thank you very much in advance!

Jawn
  • 41
  • 5
  • Hmm looks familiar ... http://stackoverflow.com/questions/11091884/how-do-i-get-the-string-of-an-element-not-including-the-strings-sibling-elemen – Musa Jun 19 '12 at 06:08
  • "contents" may vary from a string, to a single image to multiple linebreaks -- I bolded this out. Yes, I did ask that question but I realized the contents are not strings all the time. So yeah, it needs a different code. =w= – Jawn Jun 19 '12 at 06:12

6 Answers6

2

Use .contents() to get all the contents, then apply the .slice() method to slice off the last two:

$("span.a").contents().slice(0,-2)
nnnnnn
  • 147,572
  • 30
  • 200
  • 241
  • Oh sorry, but it only works if the content is an element, not if it's a string. 8( – Jawn Jun 19 '12 at 06:35
  • I tested it with just a string (copied and pasted exactly what was in your question) and it worked for me. Also worked when I inserted some img elements. http://jsfiddle.net/PLLhw/ – nnnnnn Jun 19 '12 at 06:56
  • But I need to get the html of those elements. Not just the text. – Jawn Jun 20 '12 at 16:12
  • If I use html() instead of text(), it returns as null. – Jawn Jun 20 '12 at 16:15
  • I would think you'd need to loop through the elements returned by the code in my answer and test each one to see if it is a text node or not, because I would guess `.html()` doesn't work on text nodes. Have a look at this: http://jsfiddle.net/PLLhw/1/ (Or just try `.html()` on each one and if it's null then assume that one is a text node and use `.text()` on it?) – nnnnnn Jun 20 '12 at 21:54
1
alert($('span.a').text()); //will alert 'Contents'
coolguy
  • 7,866
  • 9
  • 45
  • 71
1
var clone = $('span.a').clone();
$('span.b', clone).remove();
var text = clone.text();
console.log(text);
Dipak
  • 11,930
  • 1
  • 30
  • 31
0

if you want everything except the last 2 items try:

var $content= $(".a").contents();

var htmlnodes = $content.filter(function(ndx) {
  return (ndx < $content.length -2);
});

    console.log(htmlnodes);​
Jason Kulatunga
  • 5,814
  • 1
  • 26
  • 50
  • "contents" may be an ``, or string, or any element, so I need to define an exception. 8| – Jawn Jun 19 '12 at 06:10
  • if its `any` element, then you really leave no identifier to check against. – Control Freak Jun 19 '12 at 06:12
  • `return (ndx < $content.length -2);` seems a little less complicated, though still rather more complicated than just using the `.slice()` method... – nnnnnn Jun 19 '12 at 06:16
  • @Jawn Ive made an edit to my code, if you look at it now, it will return an array of htmlnodes, which you can then iterate through, or append to another node – Jason Kulatunga Jun 19 '12 at 06:17
  • @nnnnnn updated with your comment, your right, its a bit easier to read. – Jason Kulatunga Jun 19 '12 at 06:20
  • Cool. Note: you're not returning an "array" as mentioned in your earlier comment, you're returning a jQuery object. – nnnnnn Jun 19 '12 at 06:24
0

You can stick element A in a variable.

var $a = $('.a').children().remove();
alert($('.a').html().append($a));​​

In this example, we're not hard-coding the number of elements that should be removed or sliced or whatever. It's slightly more elegant.

Jezen Thomas
  • 13,619
  • 6
  • 53
  • 91
0
var c = $('.b').nextAll('br').remove().end().parent().find('.b').remove().end().html();
alert(c)

See it here

Arvind Bhardwaj
  • 5,231
  • 5
  • 35
  • 49