Question

这里的Javascript超级新手。我有一个空白的问题，我希望有人可以帮助我。

我有一个看起来像这样的函数：

function createLinks()  
  {
  var i = 0;
  tbody = document.getElementsByTagName('tbody')[3];
    console.log('test order ID: '+document.getElementsByTagName('tbody')[3].getElementsByTagName('tr')[0].getElementsByTagName('td')[1].textContent.replace(/^\s+|\s+$/g,''))
  trs = tbody.getElementsByTagName('tr');
console.log('trs.length = '+trs.length);
  for (i=0;i<trs.length;i++)
  {
orderId = trs[i].getElementsByTagName('td')[1].textContent.replace(/^\s+|\s+$/g,'');
    console.log('order: '+orderId);

hrefReturn = 'https://www.example.com/example.html?view=search&range=all&orderId='+orderId+'+&x=13&y=17';
linkReturn = '<a href='+hrefReturn+'>'+orderId+'</a>';
    console.log(linkReturn);

trs[i].getElementsByTagName('td')[1].innerHTML = linkReturn;

  }
}

我在初次加载页面时使用另一个函数调用此函数。这非常有效。

但是，当页面上的数据发生变化时，我也会以另一种方式调用此函数。有一个下拉列表，我附加了onClick属性。该onClick事件调用第一个函数，该函数又调用第二个函数（上图）。这两个函数都保存到文本变量中并附加到文档中，如下所示：

var scriptTextLinks = " function createLinksText()  {  var i = 0;  tbody = document.getElementsByTagName('tbody')[3];   console.log('test order ID: '+document.getElementsByTagName('tbody')[3].getElementsByTagName('tr')[0].getElementsByTagName('td')[1].textContent.replace(/^\s+|\s+$/g,''));  trs = tbody.getElementsByTagName('tr'); console.log('trs.length = '+trs.length);  for (i=0;i<trs.length;i++)      { orderId = trs[i].getElementsByTagName('td')[1].textContent.replace(/^\s+|\s+$/g,'').replace(/\s/g,''); orderId = orderId.replace(/\s/g,''); console.log('order: '+orderId); hrefReturn = 'https://www.example.com/example.html?view=search&range=all&orderId='+orderId+'+&x=13&y=17'; linkReturn = '<a href='+hrefReturn+'>'+orderId+'</a>';        console.log(linkReturn);    trs[i].getElementsByTagName('td')[1].innerHTML = linkReturn;   }  console.log('complete'); } "

最后，这是具体问题。当网页上的事件调用同一函数的这个版本时，它无法正确删除空格，这会破坏它应该创建的链接。

这是代码的确切问题部分：

orderId = trs[i].getElementsByTagName('td')[1].textContent.replace(/^\s+|\s+$/g,'').replace(/\s/g,''); orderId = orderId.replace(/\s/g,''); console.log('order: '+orderId);

所以不要像它应该那样存储变量，如下所示：

"XXXXXXXXX"

它存储如下：

"   
      XXXXXXXXXX
                  "

再次杀死了链接。

有人可以澄清这里发生了什么，以及我如何解决它？提前谢谢！

Answer 1

要剥离所有周围的空格，您可以使用标准.trim()方法。

var myString = "                \n               XXXXXXX           \n         ";
myString = myString.trim();

你可以剥离所有前导和尾随，并将内部空白压缩到一个空格，就像通常在HTML渲染中一样，就像这样......

var myString = "    \n    XXXX  \n     YYYY    \n   ";
myString = myString.replace(/\s+/g, " ").trim();

另外，请参阅下面的tharrison的评论。

（尽管我的/\s+/g模式适用于嵌入式\n换行符）

治愈IE＆lt; 9

“shim.js”

(function() {
    if (! String.prototype.trim) {
        //alert("No 'trim()' method. Adding it.");
        String.prototype.trim = function() {
            return this.replace(/^\s+|\s+$/mg, '');
        };
    }
})();

（或者，如果您可能想在垫片中做其他事情......）

var shim = {
    init: function() {
        if (! String.prototype.trim) {
            String.prototype.trim = function() {
                return this.replace(/^\s+|\s+$/mg, '');
            };
        }
    }
};
shim.init();

您的HTML文件

<script type="text/javascript" src="shim.js"></script>

在Javascript中删除空格

1 个答案: