2017-02-17 81 views
0

我試圖選擇按類「ProductPrice」列出的價格,並從$ 59中減去它以顯示免費送貨郵件,但無法獲得選擇產品價格。我哪裏錯了?在div標籤中選擇一個數字並從59中減去它並將結果顯示爲文字

<div><em class="ProductPrice">$16.95</em></div> 


<script> 
var cart = document.getElementByClassName("ProductPrice").replace('$', ''); 
var test = 59 - cart; 

document.write('<div>Add $' + cart + 'to your cart to get free shipping.</div>'); 

</script> 

回答

0

有幾件事要牢記。

  • 您應該使用getElementsByClassName而不是getElementByClassName
  • 使用括號表示法訪問特定元素。要獲取第一個元素,請附加[0]
  • 替換前請致電innerHTML

<div><em class="ProductPrice">$16.95</em></div> 
 

 

 
<script> 
 
var cart = document.getElementsByClassName("ProductPrice")[0].innerHTML.replace('$', ''); 
 
var promotion = 59 - cart; 
 

 
document.write('<div>Add $' + promotion + ' to your cart to get free shipping.</div>'); 
 

 
</script>

編輯:它可能更好地使用textContent,而不是innerHTML

+0

我假設你不必在這裏解析,因爲它是int - 字符串,所以字符串被autoparsed? – Shilly

+0

正確,因爲JS類型轉換 –

+0

無論如何,這是否是最好的做法,因爲相反的'var promotion = cart + 59'會不正確?或者我們可以假設每個人都知道嗎? – Shilly

0

你的答案是:

var cart = parseFloat(document.getElementsByClassName("ProductPrice")[0].innerHTML); 
var test = 59 - cart; 
document.write('<div>Add $' + cart + 'to your cart to get free shipping.</div>'); 

parseFloat發生在一個字符串值作爲參數,並把它轉換成從第一號開始,持續,直到它到達一個非數字的浮動。例如,您的$16.95(字符串)將變成16.95(數字)。另外,getElementsByClassName返回一個包含類名爲"ProductPrice"的所有元素的數組,因此您必須引用該數組中的第一個索引。希望這可以幫助!

+1

parseInt將16.95變爲16.使用parseFloat。 – Shilly

+0

很棒! 'parseFloat'與小數位一起工作,這對於貨幣價值是理想的。修正了我的錯誤。 –

+0

爲了記錄,當代表金錢時,你不應該使用浮動工具,因爲每個分數和浮動乘法或除法在JS中都不是精確的。所以最好的方法是用100乘以100,然後parseInt,再將最終結果除以100,這樣所有的計算都以整數完成。 – Shilly

1

您正在選擇類別爲ProductPrice的DOM元素,然後嘗試使用其上的replace函數。但問題是替換函數是String類中的一種方法。

所以,你應該首先得到包含在元素中的文本,這是字符串值:

document.getElementsByClassName('ProductPrice')[0].textContent.replace('$', '') 

您也可以使用innerHTML屬性,它會讓你的HTML代碼,而不是文本值。

另外,正如你所看到的,函數是getElementsByClassName,它返回一個包含這個類的所有元素的數組。

最後,您可能希望在Number.toFixed方法的幫助下,在得到的test變量中顯示正確的小數位數。

編輯:Javascript應該足夠聰明,可以在執行數學操作之前將字符串強制轉換爲Number,但如果您想確認,則可以使用parseFloat(string)獲取字符串的浮點數值。

相關問題