是否有一種格式化jQuery鏈的首選方式，使它們更具可讀性？

鑑於其克隆錶行這下面的示例代碼，設置一些屬性，然後將其追加到一個表：是否有一種格式化jQuery鏈的首選方式，使它們更具可讀性？

$("#FundTable").append(
    objButton.parents("tr").clone() 
     .find(".RowTitle").text("Row " + nAddCount).end() 
     .find(".FundManagerSelect").attr("id", "FundManager" + nAddCount) 
           .change(function() { ChangeFundRow(); }).end() 
     .find(".FundNameSelect").attr("id", "FundName" + nAddCount).end() 
);

有沒有人有任何建議，如何可能被格式化是對眼睛更容易嗎？有沒有公認的做法呢？

有一套可遵循的規則是有用的，可以將它們合併到一組標準中。

來源

2009-08-17 James Wiseman

我會重構這個。我發現超過3種鏈方法對眼睛

 var $clonedRow = objButton.parents("tr").clone(); 

     $clonedRow.find(".RowTitle") 
       .text("Row " + nAddCount); 

     $clonedRow.find(".FundManagerSelect") 
       .attr("id", "FundManager" + nAddCount) 
       .change(ChangeFundRow); 

     $clonedRow.find(".FundNameSelect") 
       .attr("id", "FundName" + nAddCount); 

     $clonedRow.appendTo("#FundTable");

來源

2009-08-17 08:55:20 redsquare

我喜歡這個，因爲它反映了我的做法，以正則表達式 - 有一個尤伯杯正則表達式通常不如2-3個小口袋大小的人容易理解 – 2009-08-17 09:11:34

這樣好多了。僅僅因爲你*可以*鏈並不意味着你*應該*。 – 2009-08-17 09:13:59

我一直想知道這件事，我必須承認。我對這種方法的緊張是你正在緩存一個已經被緩存的變量（在鏈棧上）。考慮到一些可能相當大，鏈接是不是更好，還是這是一個可接受的開銷？ – 2009-08-17 09:19:04

如何：

$("#FundTable").append(
    objButton.parents("tr").clone() 
     .find(".RowTitle").text("Row " + nAddCount) 
     .end() 
     .find(".FundManagerSelect").attr("id", "FundManager" + nAddCount) 
     .change(function() { 
      ChangeFundRow() 
     }) 
     .end() 
     .find(".FundNameSelect").attr("id", "FundName" + nAddCount) 
     .end() 
);

我發現鏈接，在適度使用時，可以帶來更好的可讀性。

來源

2009-08-17 08:50:03 karim79

不要那麼多。

var newContent = objButton.parents("tr").clone(); 

newContent.find(".RowTitle").text("Row " + nAddCount) 
newContent.find(".FundManagerSelect").attr("id", "FundManager" + nAddCount) 
    .change(function() { ChangeFundRow() }); 
newContent.find(".FundNameSelect").attr("id", "FundName" + nAddCount); 

$("#FundTable").append(newContent);

減少鏈接，但看起來更容易閱讀imo。

來源

2009-08-17 08:53:19

我縮進就好像括號不安：

$("#FundTable") 
    .append(objButton.parents("tr") 
     .clone() 
     .find(".RowTitle") 
      .text("Row " + nAddCount) 
     .end() 
     .find(".FundManagerSelect") 
      .attr("id", "FundManager" + nAddCount) 
      .change(function() { 
       ChangeFundRow(); // you were missing a semicolon here, btw 
      }) 
     .end() 
     .find(".FundNameSelect") 
      .attr("id", "FundName" + nAddCount) 
     .end() 
    ) 
;

來源

2009-08-17 09:03:59 nickf

我失去了這個事實，正在追加資金到這裏。 – redsquare 2009-08-17 09:09:15

你可以拆分並在第2行添加一個額外的縮進級別 – nickf 2009-08-17 09:44:31

是否有一種格式化jQuery鏈的首選方式，使它們更具可讀性？

回答

相關問題