2

私はコードをもっている

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script src="jquery.js"></script><script>
$(function(){
$(".classy").data("read","hi");//Not working .working is$("div").attr("data-read","hi");

});</script>
<style>
.classy[data-read='hello']{background:#000;}.classy[data-read='hi']{background:#fff;}</style>
</head>

<body>
<div class="classy" data-read="hello">a</div>
</body>
</html>

ドキュメントの準備ができたら、.classy の data-read 属性が hi に変更されます。css スタイルのデザイン.classy[data-read='hi']がありますが、メソッドを使用.data()して data-read 属性を操作すると機能しません。.attr()メソッドを使用すると機能しますdata-read.Why を操作します。

4

1 に答える 1

1

data-xxxあなたは何のために使われるかを誤解しています。を使用して後で jQuery を使用して取得できる HTML タグ内のデータを入力するために使用されます.data()

例:

​console.log($('.classy').data('read'));​​​​​​​​​

$(".classy").data("read","hi");

​console.log($('.classy').data('read'));​​​​​​​​​

出力:

hello
hi

後でそのデータを変更してもdata-xxx、要素の属性は変更されません。これは、条件付き CSS 処理の対象としても不適切です。

それを機能させるには、CSS クラス セレクターと組み合わせて.addClass().toggleClass()およびを使用する必要があります。.removeClass()

于 2012-06-10T12:13:11.180 に答える