ng-bind-html获取html内容的第一个字母

ng-bind-html get first letter of html content

本文关键字：第一个 获取 html ng-bind-html      更新时间：2023-09-26

我遇到了使用ng-bind-html进行html绑定的情况。我想得到除了html标签之外的html内容的第一个字符。下面是我的示例代码

<span class="first-letter">{{firstLetter}}</span>
            <div id="myDiv" ng-CLoak data-ng-bind-html="trustAsHtml(data.ContentDescription)" class="{{currentFont}}"></div>

我的html字符串如下所示

<p><span>hii my content</span></p>
the starting and ending tags are un predictable.

我想要第一个字母"h"而不是"&lt提前谢谢。

您可以使用textContent属性让浏览器为您剥离html

function strip(html)
{
   var tmp = document.createElement("DIV");
   tmp.innerHTML = html;
   return tmp.textContent || tmp.innerText || "";
}

既然你只对第一个字母感兴趣，那么你可能不需要ng-bind-html：）

如果您想突出显示第一个字母，请使用CSS:first letterhttps://developer.mozilla.org/en-US/docs/Web/CSS/%3A%3Afirst-字母

您可以删除HTML标记，只需访问第一个字母，就像我们在这样的数组中所做的那样。

var regex = /(<([^>]+)>)/ig
,   body = "<p><span>hii my content</span></p>"
,   result = body.replace(regex, "");
console.log(result[0]);

使用jQuery

console.log($('<p><span>hii my content</span></p>').text()[0]);

它会给你"h"

如果您的竞争对手

<p class="first-letter"><span>hii my content</span></p>

然后

$(".first-letter").text().substring(0,1)

无论类中有多少嵌套级别，都会返回第一个字母。第一个字母

相关文章：