javascript - JavaScript - 我如何获取元素的 ID

Question

<div id="block_msg" style="width:250px;border: solid 1px red;margin: 15px">

<div id="text_msg1">111текст111</div>

<input type="submit" onclick="clickon(**<<<HERE I WANT SEE DIV ID TEXT_MSG1>>>**)" value="Добавить">

</div>

我如何获得 id="text_msg1" 并将其放入 onclick。如何？谢谢！

Answer 1

this是当前对象，您可以查看父对象并找到 div。这个解决方案很麻烦，因为更改布局意味着它会中断。

onclick="clickon(this)"

和

function clickon(btn) {
    var wrappingDiv = btn.parentNode;
    var childrenDivs = wrappingDiv.getElementsByTagName("div");
    alert(childrenDivs[0].innerHTML);
}

JSFiddle

最好在 div 上有一个类并查找该类。

Answer 2

如果要获取前一个元素兄弟，遍历 DOM 直到找到它：

function get_previous_element_sibling(element) {
    var prev = element.previousSibling;

    while (prev && prev.nodeType !== 1) {
        prev = prev.previousSibling;
    }

    return prev;
}

然后你可以得到前一个兄弟姐妹：

get_previous_element_sibling(this)

及其ID

get_previous_element_sibling(this).id

Answer 3

根据您的评论yes, preceding! this line将不适用于 IE8 及更低版本，因为previousElementSibling

<input type="submit" onclick="clickon(this.previousElementSibling.id)" value="Добавить">

或使用 jQuery 进行跨浏览器支持

<input type="submit" onclick="clickon($(this).prev().attr('id'))" value="Добавить">