Last Updated: July 21, 2019

Safe vs Unsafe jQuery Methods

We all know XSS is bad and we all use jQuery, unfortunately its API doc doesn't do a very good job explaining what jQuery methods are safe to use for unescaped input, and which are not.

Safe

.text()
.attr() // still needs to be careful when used in an href
.prop()
.val()

Unsafe

$("html code")
.html()
.append*()
.insert*()
.prepend*()
.wrap*()
.before()
.after()

Written by Jimmy Yuen Ho Wong

Say Thanks

Respond

Related protips

JavaScript iterate through object keys and values

591.6K

jQuery .find and .closest are your best friends

492.3K

jQuery: When to use $(document).ready() and when $(window).load()

226K

4 Responses

Add your response

arm

I wouldn't consider .attr as a safe method. Example: .attr('href', 'javascript:alert()')

over 1 year ago ·

wyuenho

Good call!

over 1 year ago ·

noitidart

Superb post, thank you for this!

over 1 year ago ·

noitidart

Can you please show an example of the XSS safe DOM insertion. Would it be:

jQuery('<div/>', {
    id: 'foo',
    href: 'http://google.com',
    title: 'Become a Googler',
    rel: 'external',
    text: 'Go to Google!'
}).appendTo('#mySelector');

Thank you

over 1 year ago ·