Javascript 基于标签值html增加图像边距

我有一个位于屏幕底部的图像，我想根据标签的值增加其边距（将其移向顶部）

<img src="flag.png"
style=" margin-left:50%;
        position:absolute;
        margin-top:50%;
        bottom:0px;
        ">
<label id="countdown" > countdown: </label>

倒计时：

标签id=“倒计时”经常更新

---

基本上，是否可以根据id=“倒计时”的值向上移动图像（增加“bottom:0；”的值）？

我不确定标签的值是如何更改的。 在更新标签内容的同时更新标志样式可能更容易

下面是一个让您开始学习的示例：

---

如果这不是一个选项，请查看我的其他答案

我不确定标签的值是如何更改的。 在更新标签内容的同时更新标志样式可能更容易

下面是一个让您开始学习的示例：

---

如果这不是一个选项，请查看我的其他答案

由于您指出必须从标签中获取值，因此有一种方法：

$（函数（）{
$（'label'）.bind（'domsubtredemodified'，function（）{
var labelText=$（'label'）.html（）；
//使用正则表达式从标签字符串中获取数字
var matches=labelText.match（/\d+$/）；
//事件以空文本和新内容激发
//只有在有labelText和有效数字时才更新标志
if（labelText&&matches[0]）{
var countDownNumber=parseInt（匹配[0]）；
//我这里用100倒计时，但是
//你可能会有一些计算来确定你的旗帜在这里的高度。
$（'.flag'）.css（'bottom'，100倒计时编号）
}
});
//单独的代码更新标签
var i=100；
setInterval（函数（）{
$（'label'）.html（'countdown:'+i）；
我--；
如果（i==0）{
i=100；
}
}, 100);
})

.flag{
宽度：30px；
左边距：50%；
位置：绝对位置；
利润率最高：50%；
底部：0px；
}

倒计时：

由于您指出必须从标签中获取值，因此有一种方法：

$（函数（）{
$（'label'）.bind（'domsubtredemodified'，function（）{
var labelText=$（'label'）.html（）；
//使用正则表达式从标签字符串中获取数字
var matches=labelText.match（/\d+$/）；
//事件以空文本和新内容激发
//只有在有labelText和有效数字时才更新标志
if（labelText&&matches[0]）{
var countDownNumber=parseInt（匹配[0]）；
//我这里用100倒计时，但是
//你可能会有一些计算来确定你的旗帜在这里的高度。
$（'.flag'）.css（'bottom'，100倒计时编号）
}
});
//单独的代码更新标签
var i=100；
setInterval（函数（）{
$（'label'）.html（'countdown:'+i）；
我--；
如果（i==0）{
i=100；
}
}, 100);
})

.flag{
宽度：30px；
左边距：50%；
位置：绝对位置；
利润率最高：50%；
底部：0px；
}

倒计时：

是的，每次倒计时值更改时，您都需要一个JS来不断检查倒计时值。。。但首先，将你的JS粘贴到这里，展示你的尝试是的，你需要一个JS在每次倒数改变时不断检查倒数的值。。。但是首先，在这里粘贴你的JS，显示你已经尝试了什么。谢谢参考，我是在通过读取标签的值来更改css之后。在这种情况下，绑定到“DOMSubtreeModified”应该可以工作。请参阅我的另一个答案。感谢您的参考，我正在通过读取标签的值更改css。在这种情况下，绑定到“DOMSubtreeModified”应该可以工作。看看我的另一个答案。

$(function() {
  var initialCountDown = 100;
  var countDown = initialCountDown;


  setInterval(function(){
    // update label 
    $('#counter').text(countDown); 

    // update image style
    $('img').css('bottom', initialCountDown-countDown);

    // progress countdown
    countDown--;

    // reset counter
    if (countDown == 0){
      countDown = initialCountDown;
    }
  }, 100);
});