本文详解为何$("title"+id)等jQuery选择器失效——根本原因是遗漏ID选择器必需的#符号，导致jQuery查找不存在的HTML标签而非对应ID的元素。
本文详解为何`$("title"+id)`等
jquery
选择器失效——根本原因是遗漏
id选择器
必需的`#`符号，导致jquery查找不存在的html标签而非对应id的元素。
在使用 jQuery 操作 DOM 元素时，
选择器语法的准确性直接决定代码是否生效
。你遇到的问题——第1、2行不工作（如 $("title"+id)、$("edit"+id)），而第3、4行能正常运行——其根源并非 jQuery 本身缺陷，而是
CSS 选择器语义理解偏差
。
? 问题定位：$("title"+id) 是什么？
该写法等价于：
$("title123") // → 查找 标签（HTML 中根本不存在！）
jQuery 将其解析为「标签名选择器」，试图匹配名为 title123 的 HTML 元素（如
...），但你的实际目标是 ID 为 title123 的
元素。
基于jQuery的AJAX和JSON的实例 中文WORD版
本文档主要讲述的是基于jQuery的AJAX和JSON的实例；过jQuery内置的AJAX功能，直接访问后台获得JSON格式的数据，然后通过jQuer把数据绑定到事先设计好的html模板上，直接在页面上显示。有需要的朋友可以下载看看
下载
✅ 正确写法应使用
ID 选择器语法
：$("#title" + id)
同理：
$("edit" + id) → ❌ 错误：查找 标签
$("#edit" + id) → ✅ 正确：查找 id="edit123" 的元素
$("done" + id) → ❌
$("#done" + id) → ✅
$("input" + id) → ❌（且 input 是标签名，非ID；此处应为 $("#input" + id)）
$("#input" + id) → ✅
✅ 修正后的 handler 函数
function handler(id) {
$("#title" + id).attr("hidden", true); // 隐藏标题段落
$("#edit" + id).attr("hidden", true); // 隐藏编辑按钮
$("#done" + id).removeAttr("hidden"); // 显示提交按钮
$("#input" + id).removeAttr("hidden"); // 显示输入框
}
⚠️ 注意事项
attr("hidden", true) 等价于添加 hidden="hidden" 属性，语义正确；也可用 hide()（CSS display: none），但二者行为略有差异（hidden 属于可访问性语义，hide() 仅视觉隐藏）。
确保 jQuery 已加载，且 handler() 调用时 DOM 已就绪（推荐包裹在 $(document).ready(...) 内）。
模板中 生成的 ID 合法（无空格/特殊字符），符合 CSS ID 命名规范，可安全用于 # 选择器。
? 验证技巧：浏览器控制台快速调试
在开发者工具中执行：
$("#title123").length // → 应返回 1（存在）
$("title123").length // → 返回 0（不存在，印证错误原因）
掌握选择器本质（# = ID，. = class，无符号 = tag），是避免此类“看似随机失效”问题的关键。jQuery 强大，但绝不替你纠正选择器逻辑——精准定位，始于一个小小的 #。
