ismap属性必须嵌套在标签内才生效，单独使用无效；点击时以?x,y格式将整数坐标拼接至URL末尾，服务端需手动解析，且HTML5中可简写为ismap，XHTML则须写为ismap="ismap"。
ismap 属性必须嵌套在 <a> 标签内才生效
单独写 <img src="map.jpg" ismap> 是无效的，浏览器直接忽略该属性。ismap 的坐标传递机制依赖于超链接上下文：只有当 <img> 是带有有效 href 的 <a> 元素的直接子元素时，点击行为才会触发坐标拼接到 URL 查询字符串中。
常见错误现象包括：图片可点击但地址栏没变化、服务器收不到 ?x,y 参数、控制台无报错但逻辑不执行——基本就是漏了外层 <a> 包裹。
-
<a href="/handle-click"><img src="area.png" ismap></a>✅ 正确 -
<div><img src="area.png" ismap></div>❌ 无效 -
<a href="#"><img src="area.png" ismap></a>⚠️ 可触发，但需服务端能处理空 href 或 hash 跳转
坐标格式固定为 ?x,y，不是 ?x=123&y=456
浏览器不会生成键值对形式的查询参数，而是把两个整数用英文逗号拼接后追加到 URL 末尾。例如点击位置 (135, 109)，最终请求地址是 /handle-click?135,109，而不是 /handle-click?x=135&y=109。
服务端解析时必须按位置拆分，不能依赖标准 query string 解析库自动映射字段名。PHP 中可用 explode(',', $_SERVER['QUERY_STRING'])，Node.js 中可用 url.parse(req.url, true).query 但要注意它对这种无键名格式返回空对象，得手动截取 req.url.split('?')[1] 再切分。
- 坐标原点始终是图片左上角（0,0）
- 坐标值为整数，单位像素，无小数
- 若 URL 原本已有查询参数，ismap 会追加在最后，如
/click?mode=debug&135,109—— 这种情况需先剥离已有参数再提取坐标
HTML5 中 ismap 是布尔属性，但 XHTML 要求写成 ismap="ismap"
现代 HTML5 文档中，ismap 可以简写为 <img ismap>；但在 XHTML 或严格校验场景下，必须显式赋值为 ismap="ismap"，否则解析失败。
这个差异容易被忽略，尤其当项目需兼容旧版构建工具或遗留 CMS 输出时。如果页面在 IE 或某些老版本 WebKit 内核中坐标不传，先检查属性写法是否符合当前文档类型声明（<!DOCTYPE html> vs <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN">）。
- HTML5 推荐：
<a href="/map"><img src="tulip.jpg" ismap></a> - XHTML 必须：
<a href="/map"><img src="tulip.jpg" ismap="ismap"></a> - 不要写
ismap="true"或ismap=""，浏览器可能不识别
客户端图像映射（usemap）和服务器端（ismap）本质不互斥
同一个 <img> 可同时带 usemap 和 ismap，用于降级支持：现代浏览器走 <map> 客户端热区，不支持 usemap 的老设备（如某些功能机浏览器） fallback 到 ismap 发坐标给服务端处理。
但要注意，usemap 的 #map-id 指向的是页面内的 <map name="map-id">，而 ismap 不需要任何额外 DOM 结构，纯靠服务端解析坐标逻辑实现区域判断。
- 服务端需自行维护坐标与业务逻辑的映射关系（比如 x∈[0,100] && y∈[0,50] → “左上花坛”）
- 没有浏览器内置热区高亮、无障碍支持弱，仅适合后台管理页或历史系统迁移场景
- 移动端 touch 事件坐标精度低，ismap 在小屏设备上体验较差，慎用于新项目
