能否将某HTML标签的属性用于无该属性的其他标签？存在哪些限制？

好问题！虽然给<p>这类本身不具备src属性的标签手动添加该属性的做法不符合HTML规范，但实际开发中确实有人这么做，咱们来拆解下具体的兼容性和限制问题：

一、兼容性情况 #

• 现代浏览器基本无问题：目前主流的Chrome、Firefox、Safari、Edge等浏览器，都支持通过getAttribute()获取标签上的任意属性——哪怕这个属性不是该标签的标准属性。你提供的代码在这些浏览器里都能正常弹出src属性的值。
• 老旧浏览器（如IE6/7）：这类古董级浏览器也支持getAttribute()获取自定义属性，但可能存在一些小细节差异（比如对属性大小写的处理），不过现在这类浏览器已经几乎被淘汰，不用太担心。

二、使用上的限制与潜在风险 #

虽然浏览器能运行这类代码，但还是有不少需要注意的地方：

• 违反HTML规范，存在未来冲突风险：W3C的HTML规范对每个标签的属性都有明确定义，非标准属性应该使用data-*前缀（比如data-src）来声明。如果直接用src这种标准属性名，未来如果HTML规范给<p>标签新增了src属性，你的代码就会和标准冲突，出现不可预料的问题。
• 可访问性与SEO问题：屏幕阅读器、搜索引擎爬虫等工具会按照HTML规范解析标签，非标准属性可能会被忽略，甚至导致工具误解标签的用途，影响页面的可访问性和搜索排名。
• 框架/库的兼容性问题：React、Vue等前端框架对自定义属性有严格的处理规则，非标准属性很可能会被框架过滤掉，或者触发警告。比如在React中，只有data-*和aria-*这类符合规范的自定义属性才会被保留。

更稳妥的替代方案 #

建议把非标准属性改成data-*格式，比如：

<p data-src="...">Hello!</p>

对应的JS代码可以这样获取：

var tags = document.getElementsByTagName("p") 
for (var i = 0; i < tags.length; i++) {
    // 两种方式都可以
    alert(tags.item(i).getAttribute("data-src"))
    // 或者用dataset API（更现代的写法）
    alert(tags.item(i).dataset.src)
}

这种做法既符合HTML规范，又能避免上述的潜在风险，是更推荐的实践方式。

内容的提问来源于stack exchange，提问作者zhin dins