如何解决jQuery before函数中字符串插值无法正确渲染的问题？

你遇到的问题是因为模板字符串的语法使用不正确：你用单引号包裹了整个HTML片段，里面的反引号只是被当作普通字符处理，JavaScript并没有解析${selectedRowData.text}这个变量占位符，所以title属性直接显示了字面量字符串。

下面是两种可行的解决办法：

方法1：使用ES6模板字符串包裹整个HTML片段 #

把外层的单引号换成反引号（），这样内部的${}`占位符就能被正确解析，同时注意属性引号的嵌套（这里title用双引号和外层反引号区分）：

elem.find('#cv-k-grid-td-alert .k-grid-alert').before(`<span class="k-icon k-i-paste-plain-text notes-icon" title="${selectedRowData.text}"></span>`);

方法2：传统字符串拼接（兼容旧环境） #

如果你的项目需要兼容不支持ES6的旧浏览器，可以用+运算符拼接字符串：

elem.find('#cv-k-grid-td-alert .k-grid-alert').before('<span class="k-icon k-i-paste-plain-text notes-icon" title="' + selectedRowData.text + '"></span>');

额外检查建议 #

• 先通过console.log(selectedRowData.text)确认变量确实有值（比如'xyz'），避免因为变量未定义或为空导致title不显示预期内容；
• 确保elem是有效的jQuery对象，目标选择器#cv-k-grid-td-alert .k-grid-alert能正确找到DOM元素。

内容的提问来源于stack exchange，提问作者Shikha thakur