Wordpress主题允许站点管理员为每个字段创建包含“描述”的表单。这些描述没有唯一的ID，只有一个通用类：“描述”。他们看起来像这样：
<div class="field-head"><label for="name">Your name</label><small class="description">A unique description for this field.</small></div>
我没有像主题一样在每个字段标签上内联显示这些描述，而是使用CSS（display：none;）隐藏了描述类，并尝试创建一个以描述为'title'属性的跨度，以便jQuery将将其显示为悬停工具提示。
这就是我想要的：
<div class="field-head"><label for="name">Your name</label><span class="tipwrapper" title='A unique description for this field.'>Hover for a tip</span><small class="description">A unique description for this field.</small></div>
我已经成功地用CSS隐藏了description字段，并尝试了各种方法在'description'类的元素之前或之后添加跨度。预期最终将遍历这些元素中的每一个，我首先尝试仅使用一个字段（第二个使用description类）来成功。这是我进行过多次尝试及其结果的两个示例：
尝试＃1的示例：
jQuery(document).ready(function($){
if (jQuery(('.field-head')[1]) ){
var tiptext = $('.field-head .description')[1].innerHTML;
var txt1 = '<span class="tipwrapper">'+tiptext+'</span>';
$('.field-head .description')[1].before(txt1);
};
});
结果：这会将HTML放置在正确的位置，但是不会呈现HTML，而是仅显示为内联文本，如下所示：
<span class="tipwrapper">A unique description for this field.</span>
尝试＃2的示例：
（我首先尝试创建工具提示，然后设置其标题）：
jQuery(document).ready(function($){
var txt1 = "<span class='tipwrapper' title=''>Hover for a tip</span>";
$('.field-head .description').before(txt1);
});
jQuery(document).ready(function($){
if (jQuery(('.field-head')[1]) ){
var classLength = $('.field-head .description').length;
var tiptext = $('.field-head .description')[1].innerHTML;
$(('.field-head .tipwrapper')[1]).attr('title', tiptext);
};
});
结果：这会正确地将工具提示跨度显示在具有描述类的每个元素之前，但是我试图在其中设置标题属性的标题属性仍然为空（即使向上面的函数添加了alert（tiptext）确认变量正确获取了描述）文本。结果HTML就是这样。
<div class="field-head"><label for="name">Your name</label><span class="tooltip" title=''>Hover for a tip</span><small class="description">A unique description for this field.</small></div>
如何将元素中的html设置为新元素之前的“ title”属性？
相关分类