jQuery　問題

げんまる/ブロガー

問題文

①div#exの要素を作成（html）
②div#exの最初の表示時にフェードインから表示　※4秒
③div#exを作成、文字列"<p>かきくけこ</p>"を挿入
④div#exの背景を黒、文字色を白に変更
⑤div#exの行頭に"<p>あいうえお</p>"を挿入
⑥div#exの行尾に"<p>さしすせそ</p>"を挿入

※難問
div#ex内の偶数たけ背景白にする


	$("#ex").fadeIn(4000);
	$("#ex").html('<p>かきくけこ</p>');
	$("#ex").css('background' , '#000000');
	$("#ex").css('color' , '#ffffff');
	$("#ex").prepend('<p>あいうえお</p>');
	$("#ex").append('<p>さしすせそ</p>');
		
		
	$("#ex").filter(":even").css('background' , '#ffffff');　

入力したのがこれ、全然反応しない。



正解

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>課題</title>
</head>

<body>	
<div id="ex" style="display: none;">ABC</div>
	
	
	
	<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
	<script>
		
		$("#ex").fadeIn(4000)  //フェードインはゆっくり表示されるので
                                 最初から表示されていてはだめ。
                                 なのでdisplay:noneで消している。
		
		$("#ex").html("<p>かきくけこ</p>");
		$("#ex").css("background", "#000");
		$("#ex").css("color", "#fff");
		$("#ex").prepend("<p>あいうえお</p>");
		$("#ex").append("<p>さしすせそ</p>");
		$("p:odd").css("background", "#fff");
</script>
	
</body>
</html>




この記事が気に入ったらサポートをしてみませんか？