判斷乙個元素節點無內容時,清除其佔位

2021-08-01 06:29:24 字數 1123 閱讀 6009

最近在修改乙個被人已經修改過ecshop**前端,在布局上遇到乙個比較好玩的事情。我把問題描述一下。

在商品頁面那裡有個商品屬性介紹欄,大概的布局是這樣的。

根據上面的要求,這些屬性是由後台自由新增的。但是這出現乙個小問題,就是當刪除中間的屬性的時候,例如刪除「商品品牌」,

商品品牌的位置會依然佔著,設想一下,假如這裡的屬性刪除,那裡的屬性也刪除,就會出現坑坑窪窪的布局情況,如下圖所示:

按照要求是,後面的屬性要把空的位置補上,避免出現這種元素無內容存在卻佔位的情況。

這個布局是用li實現的,再看一下原本的css布局**:

width: 25%;

float: left;

font-size: 13px;

padding: 5px 0;

一開始是想修改width,讓li自己根據文字內容來佔位,後來發現這個方法不可行,由於每個li的內容的長度都不一樣,使得原本整齊的布局變得亂七八糟。後來想想,還是通過js來清除沒有內容的li,讓它的width為0,就可以解決問題了。

為了方便演示,特意寫了個很簡陋的**。

執行結果:

一開始這樣寫:

var oli = document.getelementsbytagname("li");

for(var i=0;i

但是,我要改的ecshop並不是這種情況,li雖然沒有文字內容,但是它有空格符!導致使用innerhtml檢測失敗。

後來想了一下,如果把li所有空格符號給去掉,不就是可以利用innerhtml檢測了嗎?

二話不說,就去試了一下。js**如下:

for(var i=0;i

最終**:

無標題文件

執行 結果如下所示:

純屬作為筆記。

判斷乙個節點是否是另乙個元素的子節點

判斷乙個元素是否包含乙個指定節點這個函式時在contains 的基礎上封裝的,contains 不相容火狐,特意封裝了一下,以後方便用。function isdomcontains parentele,ele,container if ele ele.nodetype ele.nodetype 1 ...

在無頭單鏈表的乙個節點前插入乙個節點(不能遍歷)

例如 無頭鍊錶 a b c d 在節點c前面插入乙個節點 思路 乾坤大挪移 在c的後插入乙個節點,可以將c後面新插入的節點q的值與c的值交換 即可實現c節點之前插入節點的功能 void listentry listnode phead,linknode pos datatype value 若pos...

在無頭單鏈表的乙個非頭節點前插入乙個節點

思路 由於單鏈表的單向性,所以我們現在這個非頭結點的後面插入乙個節點,然後在交換這兩個節點就可以了。標頭檔案 鍊錶定義 include include include typedef int datatype typedef struct strnode node typedef struct st...