a<span>在DOM中动态附加

width of a <span> appended dynamically in DOM

本文关键字：动态 DOM gt lt span      更新时间：2023-09-26

这看起来很简单，但我不知道这里出了什么问题。我动态地附加了一个<span>，如下所示：
$("#parent").append("<span style='display:inline-block; position:absolute; background:yellow; z-index:10; top:12px;' id='mathBox"+flag_id+"'></span>");

现在，当按下某个键（在我的情况下是TAB！）时，我需要找到这个<span>的宽度
最初我试过这样的jquery：
var width_of_text= $("'mathBox'+flag_id").width(); alert(width_of_text);
但这在控制台中显示了一个错误，即该表达式未被识别（甚至我也觉得这里不对劲！！）
然后我尝试使用vanilaJS如下：
var mathBox_id=document.getElementById('mathBox'+flag_id); var width_of_text= mathBox_id.offsetWidth; alert(width_of_text);

现在这个效果很好，但它给我显示了错误的宽度。DOM上存在的<span>元素（在测试时）的宽度仅为25，但其宽度显示为111
我知道我一定在做一些愚蠢的事情，但我就是抓不住。
请帮忙！！

jQuery版本的语法是

var width_of_text= $('#mathBox'+flag_id).width();
alert(width_of_text);

var width_of_text= $('mathBox'+flag_id).width();使用带有id的#符号。

var width_of_text= $('#mathBox'+flag_id).width();

相关文章：