標題: 如何用遍歷節點的方式取得某一個指定id元素的內容 [打印本頁]

---

作者: joo    時間: 2015-9-2 16:08     標題: 如何用遍歷節點的方式取得某一個指定id元素的內容

您好：
我想要用遍歷節點的方式取得某一個指定id元素的內容後，
動態添加到<div id="output">元素內，
請問此寫法可以找到<div id="div_02">的元素，
但卻不能找到<div id="div_03">，
一直想不通是哪裏出問題，
請問應該怎麼寫才對呢？

---

作者: joo    時間: 2015-9-2 16:08

以下是程式碼：

<div id="div_aaa">div_aaa</div>
        <div id="div_bbb">
                div_bbb
                <p>p_01</p>
                <div id="div_02">
                        <p>456</p>
                        <div id="div_03">
                                div_03
                                <span> + span</span>
                        </div>
                        <a>link</a>
                </div>
                123
        </div>
        <p>結束</p>
        <div id="output"></div>

        <script>
                window.onload = function(){
                        function get_dom(elem, target_id){
                                // 元素：elem
                                for(var i=0; i<elem.childNodes.length; i++){
                                        // 迴圈 (i) : elem.childNodes[i]
                                        if(elem.childNodes[i].id == target_id){
                                                return elem.childNodes[i];
                                        }
                                        get_dom(elem.childNodes[i], target_id);
                                }
                        }
                       
                        var elem = document.getElementById("div_bbb");
                        var target_id = "div_02";
                        var target = get_dom(elem, target_id);
                       
                        var output = document.getElementById("output");
                        output.innerHTML = target.innerHTML;
                }
        </script>

---

作者: wmh    時間: 2015-9-2 21:42

事實上是有找到，但是回給上一層後你沒有處理，你需要再檢視一下遞迴的邏輯。

---

作者: joo    時間: 2015-9-3 11:21

wmh 您好：
謝謝您的回覆
原來是要再判斷一下是否有回傳值
困惱我將近一個禮拜的問題了
太感謝您囉
我改成以下就可以了

function get_dom(parent, target_id){
        // 元素：parent
        for(var i=0; i<parent.childNodes.length; i++){
                // 迴圈 (i) : parent.childNodes[i]
                if(parent.childNodes[i].id == target_id){
                        return parent.childNodes[i];
                }
               
                // 遞迴函數
                var target = get_dom(parent.childNodes[i], target_id);                       
                // 如果函數回傳的是 ture 值，就返回該值
                // 如果函數回傳的是 false 值，就要繼續迴圈尋找元素
                if(target){
                        console.log(target.innerHTML);
                        return target;
                }
        }               
}

---

歡迎光臨 jsGears.com 技術論壇 - AJAX, JavaScript, jQuery, 網站開發, 前端效能優化 (http://www.jsgears.com/)