【问题标题】:What's a good way to return an element's path?返回元素路径的好方法是什么?
【发布时间】:2015-03-18 14:42:03
【问题描述】:

假设我有一个按钮,但我不知道它在运行时在哪里。是否可以返回按钮的位置?

编辑:“按钮”看起来像这样,还有更多与此相同的无序列表

<ul>
    <li><a href='#'><span>Add</span></a>
        <ul class="calendar-options">
            <li><a href='#' onclick="EventOne()"><span>One</span></a></li>
            <li><a href='#' onclick="EventTwo()"><span>Two</span></a></li>
            <li><a href='#' onclick="EventThree()"><span>Three</span</a></li>
        </ul>
    </li>
</ul>
<ul>
    <li><a href='#'><span>Add</span></a>
        <ul class="calendar-options">
            <li><a href='#' onclick="EventOne()"><span>One</span></a></li>
            <li><a href='#' onclick="EventTwo()"><span>Two</span></a></li>
            <li><a href='#' onclick="EventThree()"><span>Three</span</a></li>
        </ul>
    </li>
</ul>
<ul>
    <li><a href='#'><span>Add</span></a>
        <ul class="calendar-options">
            <li><a href='#' onclick="EventOne()"><span>One</span></a></li>
            <li><a href='#' onclick="EventTwo()"><span>Two</span></a></li>
            <li><a href='#' onclick="EventThree()"><span>Three</span</a></li>
        </ul>
    </li>
</ul>

【问题讨论】:

标签: javascript dynamic


【解决方案1】:

将“this”传递给处理程序应该会为您提供被点击的元素。这是你想要的吗?

<script>
    function EventOne(el) { 
        // Do something with el
    }
</script>    

<ul>
    <li><a href='#'><span>Add</span></a>
        <ul class="calendar-options">
            <li><a href='#' onclick="EventOne(this)"><span>One</span></a></li>
            <li><a href='#' onclick="EventTwo(this)"><span>Two</span></a></li>
            <li><a href='#' onclick="EventThree(this)"><span>Three</span</a></li>
        </ul>
    </li>
</ul>

【讨论】:

  • 看起来它可以解决问题,我可以通过父母爬上 DOM 树吗? (小注:每个无序列表都在一个表中,我正在尝试获取该行)
  • @Cody 你可以使用el.parentNodedeveloper.mozilla.org/en-US/docs/Web/API/Node/parentNode向上遍历Dom
  • 就我个人而言,我会使用 JQuery,因为它是理想的选择,但如果这不是一个选项,则按照 @mcmullins 使用 parentNode 循环就可以了
  • 请注意,如果您使用类似的东西,您的事件将始终必须附加在您的 HTML 中。如果将来您决定在 JavaScript 中附加您的事件,您将需要重构以使用 event.target/event.currentTarget
  • 如果它是理想的,我将如何使用 JQuery 呢? (没有身份证等)。 @mcmullins 他们调用的函数在我完成后不会被修改
猜你喜欢
  • 1970-01-01
  • 2020-03-26
  • 2016-08-11
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多