在Greasemonkey腳本中強制使用jQuery進行單詞換行？

Question

我正在寫一個利用jQuery進行論壇的GreaseMonkey腳本。我試圖強迫帖子中的長詞打破，以避免伸展頁面。

我原本是這樣的：

 $('.post').html(function(i, v) { 
      var edited = false; 
      // Break tags, links, and line breaks into separate 
      var words = v.replace(/<span(.+)<\/script\>/gi, " ").replace(/\</ig, " ").replace(/http:[^ ]+/gi, " ").replace(/&[^;]+;/gi, " ").replace(/[\n|\r]/g, " ").split(" "); 
      for (var ii = 0; ii < words.length; ii++) { 
       if (words[ii].length > word_length) { 
        edited = true; 
        v = v.replace(words[ii], insert_breaks(words[ii])); 
       } 
      } 
      if (edited) return v; 
     }); 

該網站自然有每個崗位的不同元素（如粗體標記，錨等），所以我剝離出來，只留下了文字，這是我然後檢查單詞長度（前面定義），並用其損壞的部分替換該單詞。有些帖子會包含一些JavaScript，格式如<span>...</span><script>...</script>，這就是爲什麼我使用你看到的第一個替換。

我遇到的問題是，當一個單詞被打破並且我返回v時，元素中包含的本地JavaScript被打破，GreaseMonkey腳本在替換元素的HTML後停止。

我看不出我如何使用CSS word-break，因爲我需要設置一個寬度 - 這是我無法爲每個用戶設置的寬度，因爲我無法相信頁面加載時的寬度。

Answer 1

找到了解決辦法。我發現的最好方法是遍歷元素中的每個節點，如果它是文本節點，則從那裏修改文本。這是它的要點：

function insert_breaks(mtext) { 
     if (mtext.length <= word_length) { 
      return mtext; 
     } else { 
      mresult = mtext.substr(0, word_length) + " "; 
      var newsection = mtext.substr(word_length); 
      return mresult + insert_breaks(newsection); 
     }    
    } 

    function checkTextNodes(node) { 
     if (node.nodeType == 3) { 
      var v = node.nodeValue; 
      var edited = false; 
      var words = v.split(" "); 
      for (var ii = 0; ii < words.length; ii++) { 
       if (words[ii].length > word_length) { 
        edited = true; 
        v = v.replace(words[ii], insert_breaks(words[ii])); 
       } 
      }  
      if (edited) node.nodeValue = v; 
     } else { 
      for (var i = 0; i < node.childNodes.length; i++) { 
       checkTextNodes(node.childNodes[i]); 
      } 
     } 
    } 

    function word_break() { 
     $('.post').contents().each(function() { 
      checkTextNodes(this); 
     });   
    }