有没有一个干净和健壮的方式,我可以测试(使用纯
JavaScript或jQuery)如果HTML元素可以包含一些文本？
例如,< br>,< hr>或< tr>不能包含文本节点,而< div>,< td>或< span>能够.
测试此属性的最简单的方法是控制标签名称.但这是最好的解决方案吗？我认为这是最糟糕的
编辑：为了澄清问题的意义,需要指出的是,完美的答案应该考虑两个问题：
>根据HTML标准,元素可以包含文本节点吗？
>如果元素包含一些文本,会显示吗？
显然,前面列表的每个点都有一个子回答.
解决方法
The W3 standard for “void elements”规定：
Void elements
area,base,br,col,embed,hr,img,input,keygen,link,menuitem,Meta,param,source,track,wbr
显然还有一些unofficial标签.
您可以使用黑名单并使用.prop(‘tagName’)获取标签名称：
(function ($) {
var cannotContainText = ['AREA','BASE','BR','COL','EMBED','HR','IMG','INPUT','KEYGEN','LINK','MENUITEM','Meta','PARAM','SOURCE','TRACK','WBR','BASEFONT','BGSOUND','FRAME','ISINDEX'];
$.fn.canContainText = function() {
var tagName = $(this).prop('tagName').toUpperCase();
return ($.inArray(tagName,cannotContainText) == -1);
};
}(jQuery));
$('<br>').canContainText(); //false
$('<div>').canContainText(); //true
在这里,您还可以将自己的标签添加到cannotContainText(例如,添加< tr>,它不是正式的一个void元素,因为它不匹配specification“一个void元素是一个元素,其内容模型永远不允许它具有内容在任何情况下,虚空元素都可以有属性.“).
