在shopify中使用javascript唯一标识按钮

有没有办法用javascript识别shopify网站上的搜索按钮

我看了很多商店，找不到这些按钮的共同点。是否有某种api，以便我可以识别这些按钮以添加事件

这两个按钮都是搜索按钮，但来自不同的商店：

<button class="search-header__submit search__submit btn--link site-header__icon" type="submit">
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-search" viewBox="0 0 37 40"><path d="M35.6 36l-9.8-9.8c4.1-5.4 3.6-13.2-1.3-18.1-5.4-5.4-14.2-5.4-19.7 0-5.4 5.4-5.4 14.2 0 19.7 2.6 2.6 6.1 4.1 9.8 4.1 3 0 5.9-1 8.3-2.8l9.8 9.8c.4.4.9.6 1.4.6s1-.2 1.4-.6c.9-.9.9-2.1.1-2.9zm-20.9-8.2c-2.6 0-5.1-1-7-2.9-3.9-3.9-3.9-10.1 0-14C9.6 9 12.2 8 14.7 8s5.1 1 7 2.9c3.9 3.9 3.9 10.1 0 14-1.9 1.9-4.4 2.9-7 2.9z"></path></svg>
<span class="icon__fallback-text">Submit</span>

提交

搜索

由于主题的这一部分可以完全定制，因此不太可能找到在所有情况下都适用的选项。但最有可能的情况是，搜索按钮将放置在表单中，其

操作

与

/search

相等。因此，基于此，您可以尝试使用以下选择器：

提交时：

• form[action^='/search']

再次单击：

• form[action^=/search]按钮

• form[action^=/search]输入[type='submit']

---

能否在Shopify上修改这些按钮的html？（我从未使用过）不，它们可能没有任何共同点，因为您可以使用任何HTML并从主题模板中自定义它们。“你为什么需要这些？”弗拉基米尔补充道

<button type="button" class="btn--link site-header__icon site-header__search-toggle js-drawer-open-top">
        <svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-search" viewBox="0 0 37 40"><path d="M35.6 36l-9.8-9.8c4.1-5.4 3.6-13.2-1.3-18.1-5.4-5.4-14.2-5.4-19.7 0-5.4 5.4-5.4 14.2 0 19.7 2.6 2.6 6.1 4.1 9.8 4.1 3 0 5.9-1 8.3-2.8l9.8 9.8c.4.4.9.6 1.4.6s1-.2 1.4-.6c.9-.9.9-2.1.1-2.9zm-20.9-8.2c-2.6 0-5.1-1-7-2.9-3.9-3.9-3.9-10.1 0-14C9.6 9 12.2 8 14.7 8s5.1 1 7 2.9c3.9 3.9 3.9 10.1 0 14-1.9 1.9-4.4 2.9-7 2.9z"></path></svg>
        <span class="icon__fallback-text">Search</span>
      </button>