Re: [問題] jQuery如何取id尾數當作顏色代碼?
※ 引述《ateclean (阿吃)》之銘言:
: 想請教板上的前輩們
: 最近在把玩wordpress
: 遇到一個小問題
: 如何用jQuery取得元素的id後幾碼,然後套用到css中呢?
: Html結構:
: <div id="post-159" class="post">
: <h3 class="story"></h3>
: <p>...</p>
: </div>
: 現在是希望把div的id套用到h3的border-left-color
: 至於顏色則是希望改成#A59
: 黃色的59是取ID後兩碼
: 請問這樣該如何用jQuery完成呢?
: 我想到的方法是
: $('div.post h3.story').css('border-left-color','#A'+?+?);
My solution, 也許不夠好:
$('div.post').each(function(index) {
var id = $(this).attr('id');
var colorValue = '#A' + id.substr(id.length - 2, 2);
$(this).find("h3.story").css('border-left-color',colorValue)
});
幾個想法:
* .each(function(index)) 對每個match到的東西作處理
* $(this):each裡頭會把match到的元素的「DOM Tree」放在this
因此用$(this)轉成jQuery object
* string.substr: 決定從0為底開始第幾個開始切,一共切出幾個,
string.length: 拿出字串的長度
所以這樣就會切出最後兩個
* 最後 find 會找出這裡頭match的東西,return裡頭的jQuery object
所以就可以改他的CSS
另外給個建議,CSS Selector愈簡單通常效能愈高
div.post 改成.post也許會好一點
h3.story看狀況,如果你的post裡只會有一個h3,大可寫成h3:first
: 那兩個問號我試了一些笨方法後終於放棄了XDD
: 想不出來ORZ
: ---
: 以前都只是拿jq來玩玩dom淺淺的操作
: 但是這次忽然想玩點不一樣的
: 但是都想不出個好方法解決@@
: (javascript基礎沒學 /__\ )
: 希望可以得到解答 ^^ 謝謝
沒關係,JavaScript本來就比看起來難很多...
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 125.233.144.218
※ 編輯: ybite 來自: 125.233.144.218 (10/24 02:09)
→
10/24 02:10, , 1F
10/24 02:10, 1F
→
10/24 02:10, , 2F
10/24 02:10, 2F
推
10/24 22:13, , 3F
10/24 22:13, 3F
→
10/24 22:13, , 4F
10/24 22:13, 4F
討論串 (同標題文章)
本文引述了以下文章的的內容:
完整討論串 (本文為第 2 之 2 篇):