tags:

views:

58

answers:

1

I want to be able to determine if the html contents of a particular element contains block level elements or not...

I was using $(el.html()).length == 0 to indicate that it doesn't which was working fine, but I soon realised that if the html contains a "successful" css selector then the whole thing goes pear-shaped.

Any ideas?

Edit

Okay, so I wasn't very clear. By "block level elements", I meant elements that are display:block, whether implicitly or explicitly.

The reason I want to do this is a bit complicated, but it goes something like this:

A. I'm working with "Content editable regions" that can contain any HTML or text. B. I have a server side module that creates wrapper around the content when in "edit" mode with various classes and meta information in the div. C. I am then using jQuery to:

  1. Move the contents of the wrapper outside of it (so that inline elements display inline... otherwise the wrapper can destroy the design of the page)
  2. Absolutely position the "wrapper" (no longer a wrapper) behind the content, and use it as a trigger for highlighting the contents and allowing a context menu to be displayed on right click.

In order to do 2 effectively, I have to fix it's width and height, which is easily done, but fails if the contents is only inline. Thinking about it, it would fail if the contents contained fixed width elements too....

So rethinking my question, I guess what I'm asking is how can I determine the width of an arbitary section of content in HTML.... Difficult, no?

A: 

In the end I have solved my problem a different way by making the wrapper a span instead of a div. That way I don't need to move its contents outside but leave it inside the wrapper. The wrapper doesn't force new lines, which is good, and it takes on the width and height of its contents.

Although I know it's not technically correct to place block elements inside a span, it seems to do the trick cross-browser of what I wanted to achieve.

Hainesy