小兔网

所属类别

选择器(Selectors) | UI 核心(UI Core)

用法

描述:选择数据已存储在指定的键下的元素。

jQuery( ":data(key)" )

参数 描述
key 数据的键。

表达式 $( "div:data(foo)") 匹配一个通过 .data( "foo", value ) 存储数据的 div

实例

选择带有数据的元素,改变它们的背景颜色。

<!doctype html><html lang="en"><head>  <meta charset="utf-8">  <title>:data() Selector 实例</title>  <link rel="stylesheet" href="https://zhishitu.com/">  <style>  div {    width: 100px;    height: 100px;    border: 1px solid #000;    float: left;  }  </style>  <script src="/images/2021/07/13/07/2021071307102015847760.js"></script>  <script src="/images/2021/07/13/07/2021071307102016279701.js"></script></head><body> <div id="one"></div><div id="two"></div><div id="three"></div> <script>$( "#one" ).data( "color", "blue" );$( "#three" ).data( "color", "green" ); $( ":data(color)" ).each(function() {  var element = $( this );  element.css( "backgroundColor", element.data( "color" ) );});</script> </body></html>