如何使用jQuery统计HTML元素的字符数？

要实现你想要的效果，jQuery本身没有内置的numberOfCharacters属性，但可以通过以下方式实现：

直接获取字符数 #

利用DOM元素的outerHTML属性获取元素的完整HTML代码（包括标签自身及所有属性），再取其长度：

var object = $('#basic');
var characters = object[0].outerHTML.length;
// 预期输出67

扩展jQuery方法（接近你想要的调用方式） #

如果想让调用更接近你示例中的写法，可以扩展jQuery的原型方法：

// 扩展jQuery方法
$.fn.numberOfCharacters = function() {
  // 只处理匹配到的第一个元素，无匹配则返回0
  return this.length > 0 ? this[0].outerHTML.length : 0;
};

// 使用方式
var object = $('#basic');
var characters = object.numberOfCharacters();
// 预期输出67

说明 #

• outerHTML会返回元素的完整HTML字符串，比如你的示例中会返回<link rel="stylesheet" type="text/css" href="style.css" id="basic">，统计这个字符串的长度正好是67。
• 如果你的选择器匹配多个元素，上述方法只返回第一个元素的字符数，若需要处理所有元素可以自行调整逻辑。

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