2017-08-11 181 views
0

我如何訪問<h2>標記。我目前的選擇是一個<span>元素,它是按鈕的子元素。我試過,但只能得到父母是按鈕。使用Javascript的Dom遍歷

請注意我有多個<Span>元素在頁面上

請注意我需要純粹的Java腳本,因爲我使用自定義的Java腳本這是谷歌標籤管理器。

所以基本上iam使用下面的代碼。只是平視的{{clickelemet}}這裏是<span>元件 <> 函數(){

var el = {{Click Element}}.parentElement.querySelector('h2'); 

    return el ? el.textContent || el.innerText : undefined; 

} 

--------------- HTML元素--- --------------------

<div class="col-12 col-md-10 offset-md-1"> 
            <h2>Blockchain – Opportunities &amp; Challenges across Multiple Industries</h2> 
            <p>It began with Bitcoin, but now it has spread. Blockchain has the potential to radically transform the way industries do business. Here are some examples of success and challenges as blockchain inserts itself into transactions and process.</p> 
            <button class="panel__link panel__link--btb" aria-expanded="false" aria-controls="panel-1"> 
             <i>+</i> <span>Expand article</span> 
            </button> 
           </div> 

感謝您的支持。

+0

後一個工作片斷 –

+0

而不是使用大括號,請給我們一個真實的點擊元素ID及其對應的HTML元素。 – asmmahmud

+0

'span'元素在哪裏? – clabe45

回答

0
document.getElementsByTagName("h2"); 
0

而且

document.querySelector('h2'); 

檢索的DOM

+0

嗨,我添加了更多關於iam試圖達到的信息。 –

-3

如果你只在你的頁面一個第一h2,使用

getElementsByTagName("h2")[0]; 如果您有多個標籤,

var parent = document.getElementById('<your-class>'); 
var child = parent.getElementById('<your-class>')[0]; 
+0

您不能在getElementById中使用類名稱,並且getElementById也會返回單個HtmlElement而非數組。 – asmmahmud

+0

你可能會想'getElementByClassName'?此外,如果您知道該ID,則無需在父級內查找。 – clabe45

+0

@ clabe45需要遍歷DOM鏈。 –

0

我想,你在你的按鈕元素上添加一個點擊事件。如果是這樣,那麼點擊事件也可以實際觸發其子元素(即跨度)。因此,爲了得到該按鈕元素的父,你已經檢查event.target:

document.querySelector('button.panel__link').addEventListener('click', 
    function(e){ 
     var el, elContent; 
     if(e.target.className === "panel__link panel__link--btb"){ 
     el = e.target.parentElement.querySelector('h2'); 
     elContent = el ? (el.textContent || el.innerText) : undefined; 
     } 

}); 
+0

我會嘗試使用while循環直到父項 –