JQ「 :contains」問題請教

jquery

noway 2019-09-02 09:19:38 ‧ 1493 瀏覽

分享至

您好：
var x=$(".time:contains('AA'),.time:contains('BB') " ) ;

您好：
我先用 contains 找出相關元素的集合
console.log(x[0])
他會把該元素抓出來
AA
12:00:02

請問，我該如何只抓 button的 text ==>AA
或只抓 span 的id 或 text
呢?
以上 id 都是動態產生的
所以須等他產生後再抓
謝謝!

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

1 個回答

暐翰

iT邦大師 1 級 ‧ 2019-09-02 09:35:46

假如想要抓取button或是span的text或是id值包含AA,可以這樣做 :
text包含AA selector : "button:contains('AA'),span:contains('AA')"
id包含AA selector : "button[id*='AA'],span[id*='AA']"

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
	console.log( $("button:contains('AA')")[0] );
    console.log( $("span:contains('AA')")[0] );
    console.log( $("button[id*='AA']")[0] );
    console.log( $("span[id*='AA']")[0] );
});
</script>
</head>
<body>

<button>AA</button>
<span>AA</span>
<button id='AA'></span>
<span id='AA'></span>

</body>
</html>

更新回答 :

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
	var aa = $("button:contains('AA')");
    var aaText = aa.contents().get(0).nodeValue;
    //解決 : 「我只想抓出 AA」
    console.log(aaText);
    
    //解決 : 「想抓 內的 id 或 12:00:01 」
    var aaChildSpan = $("button:contains('AA') > span");
    console.log( aaChildSpan.attr("id" ));
    console.log( aaChildSpan.text());
});
</script>
</head>
<body>

<button type="button" class="time" id="14" disabled="">AA<span id="new_time14">12:00:01</span></button>
<button type="button" class="time" id="15" disabled="">BB<span id="new_time15">12:00:02</span></button>
<button type="button" class="time" id="16" disabled="">CC<span id="new_time16">12:00:03</span></button>


</body>
</html>

回應 4
分享
檢舉

看更多先前的回應...收起先前的回應...

noway iT邦研究生 1 級 ‧ 2019-09-02 15:34:21 檢舉

您好：不好意思，我沒說清楚，以下面程式檔範例
當我 var x=$(".time:contains('AA'),.time:contains('BB') " ) ;
x 包含了以下2個資料
AA12:00:01
BB12:00:02

但我若想分別取取 AA 與 BB 這2個內容，該如何取? 因為 console.log(x[i].innerHTML);
他會抓出 AA12:00:01 ，而我只想抓出 AA

再者，若我想抓內的 id 或 12:00:01
要如何抓?
謝謝!

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
var x=$(".time:contains('AA'),.time:contains('BB') " )	;
  console.log(x.length );
 
  $.each(x,function(i){  
		console.log(x[i].innerHTML);
  });
 

    
});
</script>
</head>
<body>

<button type="button" class="time" id="14" disabled="">AA<span id="new_time14">12:00:01</span></button>
<button type="button" class="time" id="15" disabled="">BB<span id="new_time15">12:00:02</span></button>
<button type="button" class="time" id="16" disabled="">CC<span id="new_time16">12:00:03</span></button>

</body>
</html>

暐翰 iT邦大師 1 級 ‧ 2019-09-02 16:44:13 檢舉

noway 我更新回答在內文了

noway iT邦研究生 1 級 ‧ 2019-09-03 21:28:57 檢舉

您好：謝謝您，不想請教的是
var x=$(".time:contains('AA'),.time:contains('BB') " ) ;
抓出來應該是陣列，我把陣列
$.each(x,function(i){
var y =x[i].contents();
console.log(y);
});
結果
x[i].contents is not a function TypeError: x[i].contents is not a function
，那這樣是否要再轉型?
謝謝!