将值从一个元素复制到另一个元素

时间:2015-07-23 15:21:56

标签: javascript jquery html

我正在尝试将一个跨度的值复制到另一个跨度,其中第一个跨度的值是一个数字。有多个类字符串div,我想在每种情况下从第一个得到span值。

这是我必须使用的HTML结构

<button id="btn">Press it</button>

<div class="object">
    <div class="header">
        <span class="name">0</span>
    </div>
    <div class="children">
        <div class="string">
            <div class="header">
                <span class="name">Cheese</span>
            </div>
        </div>
        <div class="string"></div>
        <div class="string"></div>
        <div class="string"></div>
        <div class="string"></div>
    </div>
</div>

<div class="object">
    <div class="header">
        <span class="name">Biscuits</span>
    </div>
    <div class="children">
        <div class="string">
            <div class="header">
                <span class="name">Cheese</span>
            </div>
        </div>
        <div class="string"></div>
        <div class="string"></div>
        <div class="string"></div>
        <div class="string"></div>
    </div>
</div>

<div class="object">
    <div class="header">
        <span class="name">0</span>
    </div>
    <div class="children">
        <div class="string">
            <div class="header">
                <span class="name">Cheese</span>
            </div>
        </div>
        <div class="string"></div>
        <div class="string"></div>
        <div class="string"></div>
        <div class="string"></div>
    </div>
</div>

这是我到目前为止的代码,它不起作用。不确定下一步该去哪里。

jQuery(function ($) {
    $('#btn').click(function () {
        if ( $.isNumeric($('div object div.header span.name').text()) ) {
            $('div.object div.children div.string div.header span.name').html($('div.object div.header span.name').html());;
        }
    });
});

4 个答案:

答案 0 :(得分:2)

您可以使用回调函数.text()根据条件返回文本值:

$('#btn').click(function () {
     $('.object > .header .name').text(function(i,o){
       if($.isNumeric(o)){
             return $(this).parent().next().find('.header .name').text();
         }
     })
});

<强>

<强> Working Demo

答案 1 :(得分:1)

我会做这样的事情:

var text_from_span = $('.object .header span.name').text();
if ($.isNumeric(text_from_span)){
  var spans_to_fill = document.getElementsByClassName('string');
  for(var i = (spans_to_fill.length - 1); i >= 0; i--){
    spans_to_fill[i].innerHTML = text_from_span;
  }
}

Reference

答案 2 :(得分:0)

如果你能"#table.*?Stream Status:.*?<b>Stream is up at (.*?) kbps with (.*?) of (.*?) listeners</b>.*?Listener Peak.*?<b>(.*?)</b>.*?Stream Name.*?<b>(.*?)</b>.*?Content Type.*?<b>(.*?)</b>.*?Stream Genre.*?<b>(.*?)</b>.*?Stream URL.*?<b>(.*?)</b>.*?Current Song.*?<b>(.*?)</b>.*?</table#si" id,那会容易得多。 然后你可以将值读作

<span>

并设为

var txt = $('#idofspan').text();

答案 3 :(得分:0)

JS小提琴:https://jsfiddle.net/Lwwy8909/

有点像这样:

使用每个循环并匹配从文本中提取任意长度的数字。

jQuery(function ($) {
    $('#btn').click(function () {
        $('.object').each(function() {    
            if ( $.isNumeric($(this).find('.name:first').text().match(/\d+/)) ) {
                $(this).find('div.children').find('span.name').text($(this).find('.name:first').text().match(/\d+/));
            }
        });
    });
});