为HTML标签添加属性值，其中值等于HTML标签的内容 - Add attribute value to HTML tag where value is equal to HTML tag's content

Add attribute value to HTML tag where value is equal to HTML tag's content

本文关键字：标签 HTML 添加属性 | 更新日期: 2023-09-27

我发现了很多类似的问题，但没有一个能完全解决我的问题。这是我的情况:我有一个span，这个span的内容是一个由Jquery动态插入的数字。这个张成的空间有一个属性，我想让这个属性的值等于这个数字。

我试图把数字在一个变量，然后添加它通过。attr与Jquery，但没有运气那里。下面是代码:

<script>
var value= $('#min').html();
$('#min').attr('data-category', value);
</script> 

<span class="filter" data-category="" id="min"></span>

任何指示将非常感激!谢谢:)

在呈现HTML标记之前呈现脚本。

你必须把你的javascript包在jQuery $(document).ready()周围，以便在DOM准备好后触发代码，或者在渲染HTML之后放置它。

<script>
$(document).ready(function() {
    var value= $('#min').html();
    $('#min').attr('data-category', value);
});
</script> 

<span class="filter" data-category="" id="min"></span>

工作示例

添加jquery手表插件，捕捉内容的变化，可能存在更好的解决方案，但这工作，当你动态地改变你的内容与jquery

别忘了清除旧内容

$('#min').html('');

插入新的

之前

$('#min').html('new content');

确保watch()函数将触发

非常感谢你的帮助!我终于弄明白了。好了，我是这样解决的。这可能比我最初的问题更具体，但也许它可以帮助别人:

首先，我使用Jquery UI滑块的更改事件来检测滑块手柄上的任何更改:

$( "YOURSLIDER-DIV-SPAN-WHATEVER-ID-CLASS" ).slider({
change: function( event, ui ) {}
});

然后使用value方法，我将滑块句柄的值放入一个变量中。(因为我使用一个范围滑块，我有2个这样的，一个用于顶部手柄，一个用于底部)

var value = $( "YOURSLIDER-DIV-SPAN-WHATEVER-ID-CLASS" ).slider( "values", 0 );
var value = $( "YOURSLIDER-DIV-SPAN-WHATEVER-ID-CLASS" ).slider( "values", 1 );

然后我使用。attr将变量添加到底部和顶部滑动条手柄:

$('#min').attr('data-category', bottom_value);
$('#max').attr('data-category', top_value);