Question

使用JavaScript，我将浏览一系列对象。如果对象具有一个或多个非null或空值，则创建<p>元素，然后将其附加到容器元素。

var tempElem = document.createElement("P");

if( item.valueOne !== '' )
    tempElem.innerHTML += item.valueOne;
if( item.valueTwo !== '' )
    tempElem.innerHTML += item.valueTwo;

if( tempElem.innerHTML !== '' )
    containerElem.appendChild(tempElem);

以上确实过滤掉了大多数空条目，但有些条目以某种方式进入页面在chrome上，它会准确显示<p></p>
我做了一些分析，在最后一个if语句之前......

typeof tempElem.innerHTML = string
tempElem.innerHTML.length = 4
tempElem.innerHTML.charCodeAt(0) = 1
tempElem.innerHTML.charCodeAt(1) = 1
tempElem.innerHTML.charCodeAt(2) = 1
tempElem.innerHTML.charCodeAt(3) = 1
tempElem.innerHTML.charCodeAt(4) = NaN

我很遗憾。实际数据是在json中，对于这些特定值，我看到key:""。这与正在过滤的那些完全相同。

我知道我可以在创建任何类型的dom元素之前检查javascript中的值，但我想知道是什么导致了这个以及如何直接修复它。

Answer 1

原来这是由于我使用了.trim()方法 STRING.trim()不会删除x00（标题开头），x01（文本开头）等字符。
但是，如果存在于其他空字符串中，则这些字符仍将通过===""检查。

出于我的特定目的，这个简单的正则表达式解决了这个问题：
str.match(/[^\x00-\x20\x7F]/)
（如果存在至少1个非空格或'空'字符，则返回true）

空<p>元素实际上不是空的？ Ascii控制字符？

1 个答案: