StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POIs Javascript/jQuery DOM creation safe until it's added to the document?
primarykey
Id
5594254
data
AcceptedAnswerId
5595558
AnswerCount
4
ClosedDate
CommentCount
11
CommunityOwnedDate
CreationDate
2011-04-08T11:15:20.977
FavoriteCount
10
LastActivityDate
2011-05-24T16:06:45.517
LastEditDate
2011-05-20T22:29:30.877
LastEditorUserId
63523
OwnerUserId
63523
ParentId
0
PostTypeId
1
Score
30
ViewCount
1276
LastEditorDisplayName
text
Body
<p><strong>Please read this statement carefully:</strong> let's assume before ANY elements are added to the <code>document</code> <strong>all</strong> unsafe elements in $dom have been removed. But they were initially created. Ok let's continue....</p> <hr> <p>If a piece of user text is processed and can possiblity be loaded like so:</p> <pre><code>var comment = 'I\'m a naughty person!!' + '<script src="http://blah.com/some_naughty_javascript.js">'; var $dom = $('<div>' + comment + '</div>'); </code></pre> <p>Is this <strong>by itself</strong> dangerous in any way? My point being, can just the simple act of creating a DOM somehow inject anything, or is it just simply processed and the structure is created?</p> <p><strong>For example:</strong></p> <pre><code>var $dom = $('<script>alert("hi");</script>'); </code></pre> <p>Obviously the message hi does not pop up until it's added to the <code>document</code>. But:</p> <ul> <li>Can any tag or anything created in this manner be dangerous?</li> <li>Can any functions in javascript/jquery "watch" for elements being created in this manner and act on it BEFORE it's been stripped of bad elements and put on document?</li> </ul> <hr> <h2>Bounty Edit</h2> <p>So as outlined in the answers below, it seems this method isn't very safe, particularly for one reason:</p> <ul> <li><code>var $dom = $('<img src="blah.jpg"/>')</code> -- this will request for the image straight away, regardless of if the object was added to the document.</li> </ul> <p>This creates a major problem for dealing with HTML ajax requests. For example if we wanted to get the values from the inputs of the form:</p> <pre><code>$.ajax({ url: 'test.php', success: function(responseHTML) { var inputs = $(responseHTML).find('form input'); } }); </code></pre> <p>This will involuntarily cause all images to be requested for by the browser.</p> <p><strong>Bounty is awarded to anyone</strong>:</p> <ul> <li>Who can provide a nice, safe way of dealing with ajax requests without the above issue.</li> <li>Ideally doesn't provide a regex answer... i.e. what if we wanted to do <code>$(responseHTML).find('img')</code> -- removing image tags with regex can't be an option, so an unobtrusive way would be needed to stop the src from loading, but still have the same attributes, structure, etc.</li> </ul>
Tags
<javascript><jquery><security><dom>
Title
Is Javascript/jQuery DOM creation safe until it's added to the document?
singulars
PostAcceptedAnswerId
1. PO
  singulars
  PostTypePostTypeId
  PTAnswer
PostParentId
1. This table or related slice is empty.
PostTypePostTypeId
1. PTQuestion
UserLastEditorUserId
1. USGary Green
UserOwnerUserId
1. USGary Green
plurals
PostLinksPostIdRelatedPostId
1. This table or related slice is empty.
PostLinksRelatedPostIdPostId
1. PL
  singulars
  LinkTypeLinkTypeId
  LTLinked
PostsAcceptedAnswerId
1. This table or related slice is empty.
PostsParentIdCreationDate
1. PO
  singulars
  PostTypePostTypeId
  PTAnswer
2. PO
  singulars
  PostTypePostTypeId
  PTAnswer
3. PO
  singulars
  PostTypePostTypeId
  PTAnswer
VotesPostIdCreationDate
1. VO
  singulars
  PostPostId
  POIs Javascript/jQuery DOM creation safe until it's added to the document?
  UserUserId
  This table or related slice is empty.
  VoteTypeVoteTypeId
  VTUpMod
2. VO
  singulars
  PostPostId
  POIs Javascript/jQuery DOM creation safe until it's added to the document?
  UserUserId
  This table or related slice is empty.
  VoteTypeVoteTypeId
  VTUpMod
3. VO
  singulars
  PostPostId
  POIs Javascript/jQuery DOM creation safe until it's added to the document?
  UserUserId
  USnfechner
  VoteTypeVoteTypeId
  VTFavorite
CommentsPostId

Querying!

Guidance

A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.