使用JavaScript訪問div內部的嵌套值

Question

我在運行一些基本的JavaScript時遇到問題。我剛剛開始使用JavaScript，所以我還沒有接近完全掌握它。我想要實現的是返回一個選項選擇器的值在表格/表格的div中。

我使用Google跟蹤代碼管理器向Google Analytics發送數據，並嘗試使用內置的自動事件偵聽器以及自定義JavaScript宏。

基本上，有三種不同的選擇器都有不同的值。這些都在<select>的選項中。

我怎樣才能使用JavaScript從三個不同的選擇器中選擇一個值？

我正在努力解決的問題是，選擇器本身沒有ID將它們分開，但父元素atleast具有唯一的div id。

我會盡力給出一個可視化上它的外觀：

<form> 
    <div id="selection1"> 
    <table ... > 
    <select> 
    <option>Option 1</option> 
    <option>Option 2</option> 
    <option>Option 3</option> 
    </select> 
    </table> 
</div> 

    <div id="selection2"> 
    <table ... > 
    <select> 
    <option>Option 1</option> 
    <option>Option 2</option> 
    <option>Option 3</option> 
    </select> 
    </table> 
</div> 

    <div id="selection3"> 
    <table ... > 
    <select> 
    <option>Option 1</option> 
    <option>Option 2</option> 
    <option>Option 3</option> 
    </select> 
    </table> 
</div> 
</form> 

我將如何能夠從不同的選項中檢索值與被選擇？我已經試過這一點，它的工作原理：

function() { 
var option = document.GetElementsByTagName("select")[0].value; 
return option; 
} 

但後來我需要設置此爲三個不同的選擇，你可以選擇的東西的。我只是不夠明白如何編寫一個可以計算出三個不同選項中的人選擇並返回其值的JavaScript。

Answer 1

好吧，首先讓我們來提高代碼：

1. 永遠不要使用空格在ID（ID = 「NoSpacesAllowed」）在類名
   
2. 空間被用來定義多個類（類=「class1 class2 class3」）
   3.您應該始終在選項標籤中提供值屬性。
   <option value="xy">This is some random text</option>
   不過，這些值是通過任何用戶多變，所以你可以讀取修改後的值
   （有些人喜歡我經常修改，以這樣的cliend代碼，看看它打破任何功能） 永遠不要直接存儲這樣的值成數據庫！ 檢查內容（或值）是否有效，否則您可能會得到相應的通知。我的意思是biiiiiiiig問題！

一般方法：

var selects = document.getElementById("myselect"); 
var selectedValue = selects.options[selects.selectedIndex].value;// will gives u "xy" 
var selectedText = selects.options[selects.selectedIndex].text;// gives u "This is some random text" but you should not use this<br><br> 

您可能需要使用類似的東西：

var selects = document.querySelector("#selection1 select"); //This will return the first <select> inside the specified id. You may need to adjust that selector... 

var selectedText = selects.options[selects.selectedIndex].text;