将属性值添加到HTML标记，其中value等于HTML标记的内容

Question

I've found many similar questions but none quite did the trick for me. Here's my situation: I've got a span, the content of this span is a number dynamically inserted by Jquery. This same span has an attribute, I want the value of this attribute to be equal to the number.

I have tried to put the number in a variable and then add it trough .attr with Jquery but no luck there. Here's the code:

<script>

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

</script> 


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

Any pointers will be greatly appreciated! Thanks :)

Answer 1

You are rendering your script before you render the HTML tag.

You have to either wrap your javascript around the jQuery $(document).ready() to trigger the code once the DOM is ready, or put it after you render the HTML.

<script>

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

</script> 


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