我如何在 jquery 中使用類存儲元素值

Question

我如何使用它的類來存儲這個元素的值。 我曾研究過不同的概念，但沒有奏效

## Html##
output is my class here
<div class="col-sm-10 ac">
<center><b><span class="output" value='1'>1</span> Child</b></center> 
</div>
## jquery ##
var ar_value = $('.output').val(); /*--is this correct--*/

Answer 1

由於您正在嘗試獲取“值”的屬性，因此您必須使用 attr()

var ar_value = $('.output').attr('value');

如果這個元素是唯一的，你應該使用 'id' 而不是 'class'，就像 class 一樣，DOM 中可能不止一個。 此外， .val() 的使用是：

.val() 方法主要用於獲取表單元素的值，例如 input、select 和 textarea。 當在一個空集合上調用時，它返回 undefined。

http://api.jquery.com/val/

Answer 2

1. 只有輸入才有價值。 對於跨度使用data-* attribute ，這是一個無效的屬性

 var ar_value = $('.output').data('value'); console.log(ar_value)

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="col-sm-10 ac"> <center><b><span class="output" data-value='1'>1</span> Child</b></center> </div>

警報

 var ar_value = $('.output').data('value'); alert(ar_value)

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="col-sm-10 ac"> <center><b><span class="output" data-value='1'>1</span> Child</b></center> </div>

Answer 3

試試下面的代碼，如果你正在使用一個類，那么很可能不止一個 jquery 已經有一個方便的方法了。 它也適用於只有一個帶有 .output 的元素。

 $( ".output" ).each(function( index ) { console.log($( this ).attr('value') ); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="col-sm-10 ac"> <center><b><span class="output" value='1'>1</span> Child</b></center> <center><b><span class="output" value='2'>2</span> Child</b></center> </div>

Answer 4

您可能會得到這個undefined值，因為您有許多元素的類嘗試使用：

 $('.col-sm-10.ac').find('.output').each(function(){ alert($(this).attr('value')); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="col-sm-10 ac"> <center><b><span class="output" value='1'>1</span> Child</b></center> </div> <div class="col-sm-10 ac"> <center><b><span class="output" value='2'>2</span> Child</b></center> </div>