要素は次のとおりです。
span {
position:absolute;
float:left;
height:80px;
width:150px;
top:210px;
left:320px;
background-color:yellow;
display:none; //No display
border: 3px solid #111;
}
このコードを使用してディスプレイを削除し、表示できるようにします。
$( "span")。removeAttr( "display");
しかし、それは機能しません。私が使用している方法は有効ですか、または結果を取得する別の方法がありますか?
この特定の目的には、$("span").show()
で十分です。
$('#lol').get(0).style.display=''
または..
$('#lol').css('display', '')
removeAttr()
関数は、HTML属性のみを削除します。 display
はHTML属性ではなく、CSSプロパティです。 CSSプロパティを管理する代わりに css()
functionを使用します。
ただし、jQueryには show()
関数が用意されており、簡潔な呼び出しで必要な処理を正確に実行できます。
$("span").show();
「display」プロパティの代わりに「style」属性を削除する必要があります。
$("span").removeAttr("style");
最初にstyle = "display:none"で非表示になっているクリックイベントに基づいて一部のスパンを非表示にする場合は、.toggle()が最適なオプションです。
$( "span")。toggle();
理由:毎回、スタイルが既に存在するかどうかを確認する必要はありません。 .toggle()は自動的にそれを処理し、現在の状態に基づいてスパンを非表示/表示します。
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="button" value="Toggle" onclick="$('#hiddenSpan').toggle();"/>
<br/>
<br/>
<span id="hiddenSpan" style="display:none">Just toggle me</span>
使用しているjQueryは、CSS自体ではなくDOMを操作します。 CSSのWord span
を.mySpan
に変更してみて、そのクラスをHTMLの1つ以上のDOM要素に次のように適用します。
...
<span class="mySpan">...</span>
...
次に、jQueryを次のように変更します。
$(".mySpan").css({ display : inline });
これははるかにうまくいくはずです。
がんばろう!