在使用jQuery创建丰富的客户端体验时,如何避免锁定我的HTML结构？

Question

我现在已经三次遇到这种情况了,我觉得是时候我学会了如何避免这种情况.

通常,我构建HTML.一旦我对结构和视觉设计感到满意,我就开始使用jQuery来连接事件和其他东西.

事实上,有时客户想要一个小的改变,甚至是一个需要我改变HTML的中等改变,这导致我的javascript代码中断,因为它依赖于不再存在的HTML选择器.

每当我创建一个网站时,我怎么能避免自己陷入这个漏洞？我应该读的任何文章？

Answer 1

让你的选择器不那么脆弱.

• 不要通过索引,下一个兄弟,直接孩子等使用选择器
• 使用类,即使你必须在HTML中更改标记名称和元素的位置,选择器仍然可以工作
• 不指定选择器时不要使用parent()或child().确保您查找具有特定班级的父母或子女

有时,根据返工量,您必须更新脚本.保持它们尽可能分离,但总有一些耦合,它是脚本和HTML之间的接口.这就像能够在不必更改界面的情况下更改实现.有时您需要需要新界面的新行为.

我认为最好的方法是帮助您显示HTML中需要更改jQuery代码的一小部分变更示例.然后,我们可以向您展示如何在更新HTML时最小化对JS的更改