148177 2015-08-19 07:00:50 -0700 Replacing input element using outerHTML with new element containing "autofocus" focuses newly replaced element 2015-08-19 07:00:50 -0700 1 1 1 Unclassified WebKit DOM WebKit Nightly Build Unspecified Unspecified NEW P2 Normal --- 1 martijn.dashorst webkit-unassigned oldest_to_newest 1118898 0 martijn.dashorst 2015-08-19 07:00:50 -0700 When replacing an existing <input> element using outerHTML where the new markup has <input autofocus> puts the focus on the new element instead of keeping the focus on the current form element. The markup below illustrates the issue: <!DOCTYPE html> <html> <head> <script type="text/javascript"> function replaceLastName() { var newMarkup = "<input type='text' id='lastname' autofocus placeholder='Last name' value='Banana'>"; document.getElementById("lastname").outerHTML = newMarkup; } </script> </head> <body> <form> <input type="text" id="lastname" autofocus placeholder="Last name"> <input type="text" id="firstname" placeholder="First name" onfocus="replaceLastName();"> <input type="submit"> </form> </body> </html> When you modify the contents of field 'lastname' and switch the focus to 'firstname', Safari 8 and Webkit nightly remove the focus from the 'firstname' field and put the focus on 'lastname'. All other major browsers retain the focus on the 'firstname' field.