大家新年好～，
实作网页功能有时会很好奇别人是怎么做的，举个例子，
大家熟知的 Gitlab 把成员从专案里移除的时候，就是按一个 button，
button 的 html 码如下:
<button type="button" class="btn js-modal-action-primary btn-danger">
<span class="gl-button-text">Remove member</span>
</button>
首先，它上下没 <form> tag，看起来不像是直接用 form submit 送出的，
button 里没 id 没 name 没 onclick()，只有 class，
像这样的一个功能，前端做个动作后在后端做些计算，再在前端做些反应，
算是蛮常见的设计。
自己要实现也不难，但写出来明显就是跟台面上的大网站长得很不一样，
很好奇别人都是用什么样的方式来实现的，
是 form 还是 ajax，关键值是怎么传递的... 等等，
请问，是不是有什么 trace 的方式，
或者是有这类的 design pattern 可以学习的呢？

开发者工具打开可以去 trace 绑定的事件，他的元素定位方式不一定是直接找 button 可能是上层父元素作为标识，再往下一层找唯一的 button除了检查绑定的函数之外，按下按钮之后也可以检查送出的请求，去挖掘一下 DevTools 会满有帮助的

var btn=document.querySelector('button.btn-danger');btn.addEventListener('click', (e)=>{ 按下的程式码区 });任何方法抓到 DOM 元素，就可以对它加事件，不用 id / name

可以用chrome看network那一页 看看按钮送了什么资讯出去

现在用前端框架的网站很多，不如直接去找“真正的”原始码学起来比较快吧，要深入也可以直接深入那些框架的原始码

主要就是js的部分，选择器找到元素 点击触发函式执行原始码看不出onclick 是框架的关系，但基础其实都一样的选择元件,触发事件如果想要原始码有干净的风格，可以找一套框架学，比方说react, vue,angular要执行函式不需要有form。form是传递整包物件比较好的方法，要传递物件也不一定要用form，但有规则的使用更好维护。

你学的方式怪怪的 这比较像逆向工程 从别人的code反推回去 你应该是先想要做什么东西 再找要怎么做

这样学完全没问题 楼上根本吃嘴囡仔标准讲干话这个行业就是满多人会在那边屁东屁西 又不提供建议

框架编译，较大的专案很少直接写原生js