tft每日頭條

 > 生活

 > jquery選擇器屬性查詢

jquery選擇器屬性查詢

生活 更新时间:2024-09-27 15:22:27

jquery選擇器屬性查詢(13jQuery内容選擇器)1

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>13-jQuery内容選擇器</title>

<script src="../static/js/jquery-3.6.0.js"></script>

<style type="text/css">

div{

width: 100px;

height: 50px;

background-color: red;

margin-top: 15px;

}

</style>

<script>

$(function(){

// :contains(Text)

// :empty

// :has(selector)

// :parent

// :empty 作用:找到既沒有文本内容也沒有元素的指定元素

jquery選擇器屬性查詢(13jQuery内容選擇器)2

// var $div = $("div:empty")

// console.log($div)

jquery選擇器屬性查詢(13jQuery内容選擇器)3

// :parent 作用:找到有文本内容或有子元素的指定元素

var $div = $("div:parent")

console.log($div)

jquery選擇器屬性查詢(13jQuery内容選擇器)4

// :contains(Text) 作用:找到包含指定文本内容的指定元素

var $div = $("div:contains('我是div')")

console.log($div)

jquery選擇器屬性查詢(13jQuery内容選擇器)5

// :has(selector) 作用:找到包含指定子元素的指定元素

var $div = $("div:has('p')")

console.log($div)

jquery選擇器屬性查詢(13jQuery内容選擇器)6

})

</script>

</head>

<body>

<div ></div>

<div >我是div</div>

<div >我是div</div>

<div ><span>我是span</span></div>

<div ><p>我是p标簽</p></div>

</body>

</html>

,

更多精彩资讯请关注tft每日頭條,我们将持续为您更新最新资讯!

查看全部

相关生活资讯推荐

热门生活资讯推荐

网友关注

Copyright 2023-2024 - www.tftnews.com All Rights Reserved