jQuery使用find方法按name属性查找input失效 用class则正常是什么原因

核心原因 #

你使用的属性选择器与实际HTML的属性值不匹配：你代码中目标input的name属性实际值为test[]，而非你选择器中写的test，所以input[name='test']无法匹配到任何元素，调用val()自然返回undefined。
而class选择器可以正常工作，是因为目标input的class属性值确实为test，和input.test的匹配规则完全一致。

解决方案 #

你可以根据实际需求选择以下任意一种写法修复问题：

• 完全匹配name属性值，直接把方括号加入选择器的匹配规则中：

let testInput1 = parentDiv.find("input[name='test[]']").val(); 
console.log(testInput1); // 可正常打印取值

• 如果你需要匹配所有name以test开头的input元素，可以使用前缀匹配规则^=：

// ^= 表示属性值以指定字符串开头
let testInput1 = parentDiv.find("input[name^='test']").val();

• 如果你需要匹配所有name包含test字符串的input元素，可以使用包含匹配规则*=：

// *= 表示属性值包含指定字符串
let testInput1 = parentDiv.find("input[name*='test']").val();

内容的提问来源于stack exchange，提问作者Amrita Stha