Front-end development experience 01 - find to find elements

Recently, I am maintaining a 78-year-old jsp project (yes, it is the ancient project that we often complain about java and jsp. It is a densely packed jsp file with tens of thousands of lines of code. I don’t know how many people have modified the same file. The code style and There are various names. Finding files and debugging the code accounted for more than half of the development time, so I was completely confused). I finished writing it hard locally, debugged it, and updated it to the test server with all my heart. The result came directly after opening it with one click. Dahonghua, please fix the hemp for me.

. . . After debugging for more than half an hour. . .

solve:
// 错误
let dataJsonString = $("form").serializeArray()[4].value;

// 改为
let dataJsonString = $("form").find("#questionJson").val();

// 优化(避免该页面有多个form,导致获取不了指定的form)
let dataJsonString = $("#form-left").find("#questionJson").val();
analyze:

Local: Directly obtain the data of the specified subscript, and print it out normally.
Insert image description here
Test server: The same code obtains the value of the specified subscript. This is because the local branch is a project created independently from the current production environment, and the test server has multiple branches merged. Assembled together, so maybe when other branches were merged into the test server, the content of the form was inserted before the specified subscript 4. Therefore, reading the data with subscript 4 is not what you originally wanted.
This method of directly using designated subscripts and fuzzy search methods is unstable, especially in the process of collaborative development by multiple people, and it is easy to make mistakes when you do not know other people's code.
Insert image description here
Insert image description hereInsert image description here
Summary: When looking for an element, try to confirm the parent element through the exact id and class, then use find to find the id or class of its child element to confirm the child element, and then take the value of val().
Finally, attach the jq method documentation: jQuery documentation

Guess you like

Origin blog.csdn.net/weixin_44786330/article/details/129860117