HTML element with no footprint, but can be a container for another element
Question
Is there an HTML element, or an element that, when combined with the correct CSS style properties, has no footprint except that it can be used as a container for other elements?
It would almost be like a "marker" on the page marker where actual HTML that does stuff should be placed by jQuery.
Example of what it might look like:
<span id='the_view_container' style='display:dont-do-anything'></span>
The reason I ask is because I'm working with Backbonejs and when I have to add a view to the screen, I find that I either have to specify the element that the view should be pegged to when creating the view, which has its drawbacks:
theView = new TheView({
el: $('#the-view-container')
});
Or I have to insert the view inside an existing element, usually a div. This creates difficulties with templating:
theView = new TheView({});
$('#the-view-container').html(theView.el);
$('#the-view-container').addClass('theViewClass'); // <-- Shouldn't have to do this
Any input is appreciated, thanks so much!
3 answers
solution1
1 2012-08-02 02:32:08
A DOM-element not attached to the document-flow should do the trick. Try a div for instance:
var detachedDiv = $('<div/>');
theView = new TheView({
el: detachedDiv
});
Then when you want the view to be attached you would append it to <body> for instance:
$('body').append(detachedDiv);
solution2
1 ACCPTED 2012-08-02 02:42:59
You would be better off dynamically creating an element.
However, you can create a 'nothing' element like this:
<div id="nothing" style="display: none; visibility: hidden; width: 0; height: 0; line-height: 0"></div>
Then set the style when needed:
$('#nothing').css('');
solution3
1 2012-08-02 03:03:33
(assuming your CSS has no abnormal resets,) Simply use an empty <div> with an ID attached to it.
<div id="backboneJScontent"></div>
Since divs by default have 0 height, they don't render any space in the document flow until they are given a height, border, margin, outline, or padding. (They have none of those by default)
Then, when you need to insert content to it, you can just insert it directly to that div, selecting it just with the ID.
$("#backboneJScontent");
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.