Fixed #31483 -- Rewrote change_form.js without jQuery.

The use of $(document).ready() was removed. The script is loaded at the
end of the document. Therefore, the referenced DOM elements are already
available and the script does not need to wait for the full DOM to be
ready before continuing.

Now that the script has no external dependencies, it can be loaded
asynchronously. As such, the async attribute was added to the script
element.

django/contrib/admin/static/admin/js/change_form.js

@@ -1,9 +1,17 @@
-(function($) {
+(function() {
     'use strict';
-    $(document).ready(function() {
-        var modelName = $('#django-admin-form-add-constants').data('modelName');
-        if (modelName) {
-            $('form#' + modelName + '_form :input:visible:enabled:first').focus();
+    var inputTags = ['BUTTON', 'INPUT', 'SELECT', 'TEXTAREA'];
+    var modelName = document.getElementById('django-admin-form-add-constants').dataset.modelName;
+    if (modelName) {
+        var form = document.getElementById(modelName + '_form');
+        for (var i = 0; i < form.elements.length; i++) {
+            var element = form.elements[i];
+            // HTMLElement.offsetParent returns null when the element is not
+            // rendered.
+            if (inputTags.includes(element.tagName) && !element.disabled && element.offsetParent) {
+                element.focus();
+                break;
+            }
         }
-    });
-})(django.jQuery);
+    }
+})();

django/contrib/admin/templates/admin/change_form.html

@@ -68,7 +68,8 @@
             src="{% static 'admin/js/change_form.js' %}"
             {% if adminform and add %}
                 data-model-name="{{ opts.model_name }}"
-            {% endif %}>
+            {% endif %}
+            async>
     </script>
 {% endblock %}