在某些情况下,“text”方法会删除单词之间的空格

`text` method removes space between words in some case

本文关键字:删除 单词 之间 空格 方法 情况下 text      更新时间:2023-09-26

从我的容器中,我正在尝试fetch text。但是有些原因,我无法在某些场景之间取得word space。我在这里没有得到确切的问题以及如何解决这个问题..

在这个html我的控制非常有限,因为我从服务器获取html

有人给我一个解决方案吗?

var myText = $('.textHighLight').text();
$('#parent').before(myText);
//look in to here: ANDMAINTENANCE, OFAL-GHARAFA (both AND and OF) lost their space.
#parent{
    border:1px solid red;
    position:relative;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="parent">
    <div style="white-space:pre;"><span class="cls_3 textHighLight userNote1">CONSTRUCTION</span><span class="cls_4 textHighLight userNote1"> </span><span class="cls_3 textHighLight userNote1">COMPLETION</span><span class="cls_4 textHighLight userNote1"> </span><span class="cls_3 textHighLight userNote1">AND</span></div>
<div style="white-space:pre;"><span class="cls_3 textHighLight userNote1">MAINTENANCE</span><span class="cls_4 textHighLight userNote1"> </span><span class="cls_3 textHighLight userNote1">OF</span><span class="cls_4 textHighLight userNote1"> </span><span class="cls_3 textHighLight userNote1">OUTDOOR</span><span class="cls_4 textHighLight userNote1"> </span><span class="cls_3 textHighLight userNote1">COOLING</span><span class="cls_4 textHighLight userNote1"> </span><span class="cls_3 textHighLight userNote1">OF</span></div>
<div style="white-space:pre;"><span class="cls_3 textHighLight userNote1">AL-GHARAFA</span><span class="cls_4 textHighLight userNote1"> </span><span class="cls_3 textHighLight userNote1">SPORTS</span><span class="cls_4 textHighLight userNote1"> </span><span class="cls_3 textHighLight userNote1">CLUB</span><span class="cls_4 textHighLight userNote1"> </span><span class="cls_3 textHighLight userNote1">FOR</span><span class="cls_4 textHighLight userNote1"> </span><span class="cls_3 textHighLight userNote1">ASPIRE</span></div>
<div style="white-space:pre;"><span class="cls_3 textHighLight userNote1">ZONE</span></div>
</div>

代码

中没有删除空格,您会看到空跨度,

  <span class="cls_4 textHighLight userNote1"> </span>

这是在某些情况下添加空格的地方,要么删除它们,然后使用DemoUser的答案

或者只是添加它们,而不是添加它们。看这个小提琴

你行var myText = $('.textHighLight').text();从类textHighLight的元素中获取文本作为单个字符串,你需要使用 $.each() 循环遍历所有元素并传入文本并附加它,如:

var textArr = [];
$.each( $('.textHighLight'), function(idx, v) {
    textArr.push($(v).html());
});
$('#parent').before(textArr.join(" "));