javascript - 按数据属性附加值

Question

我有以下情况：

有一个表提供了以下数据属性name和value：data-specificationattributename="Basiseenheid"在下表行中：

<tr class="even" data-specificationattributename="Basiseenheid">
    <td class="a-left spec-namehide">
        Basiseenheid
    </td>     
    <td class="a-left spec-valuehide">
        KG 
    </td>   
</tr>

我喜欢的是根据数据属性获取值（KG）并将其附加到以下内容div "span.qty unit-result"：

<div class="qty-unit">
    <span class="qty-unit-result"></span>
</div>

希望有人能告诉我如何做到这一点。

Answer 1

jsFiddle 演示

var selector = $('[data-specificationattributename=Basiseenheid]');
var kgVal = selector.find('.spec-valuehide').text().trim();
$('.qty-unit-result').html(kgVal);

或者

var selector = $('[data-specificationattributename=Basiseenheid] .spec-valuehide');
var kgVal = selector.text().trim();
$('.qty-unit-result').html(kgVal);

编辑： 他们两个之间的jsPerf 测试结果。

结果 .find() 比空间选择器慢 16-18%。

.find() - 每秒 24,035 次操作，慢 18%

合并选择器 - 每秒 29,501 次操作，最快

Answer 2

使用 jQuery，您可以使用以下命令获取 KG：

var fst= $( ".spec-valuehide" ).html();

然后将它附加到另一个宽度这个命令：

$( ".qty-unit-result" ).append(fst);

见： http : //api.jquery.com/append/ http://api.jquery.com/html/

Answer 3

find_value($key){
    return $('table tr[data-specificationattributename='+$key+'] td.spec-value-hide').html().trim();
}

$('div.qty-unit span.qty-unit-result').html(find_value('Basiseenheid'));