-
parent > child选择器的范围要小些，它所选择的目标是子集元素，相当于一个家庭中的子辈们，但不包括孙辈，它的调用格式如下： $(“parent > child”)//第一代子元素查看全部
-
而通过prev + next选择器就可以查找与“prev”元素紧邻的下一个“next”元素，格式如下： $(“prev + next”)查看全部
-
与上一节中介绍的prev + next层次选择器相同，prev ~ siblings选择器也是查找prev 元素之后的相邻元素，但前者只获取第一个相邻的元素，而后者则获取prev 元素后面全部相邻的元素，它的调用格式如下： $(“prev ~ siblings”)查看全部
-
功能简介查看全部
-
此外，html()方法的功能是设置或获取元素中显示的内容，针对该方法我们在后面的章节中会有详细介绍。查看全部
-
$("#a").click(function(){ if ($("#a").html()=="更多") { //如果按钮为“更多” //显示所有li $("li").css("display","block"); //将按钮设置为“简化” $("#a").html("简化"); } else if ($("#a").html()=="简化") { //如果按钮为“简化” //只显示前5条 $("li:gt(4)").css("display","none"); //将按钮设置为“更多” $("#a").html("更多"); } })查看全部
-
<body> <h3>改变"title"属性值为"蔬菜"的背景色</h3> <ul> <li title="蔬菜">茄子</li> <li title="水果">香蕉</li> <li title="蔬菜">芹菜</li> <li title="水果">苹果</li> <li title="水果">西瓜</li> </ul> <script type="text/javascript"> $("li[title='蔬菜']").css("background-color", "green"); </script> </body>查看全部
-
<body> <h3>显示隐藏元素的内容</h3> <input id="hidstr" type="hidden" value="我已隐藏起来"/> <div></div> <script type="text/javascript"> var $strHTML = $("input:hidden").val(); $("div").html($strHTML); //$("#hidstr").attr('type','text'); // $strHTML.attr('type','text'); </script> </body>查看全部
-
<表达式1>?<表达式2>:<表达式3>; "?"运算符的含义是: 先求表达式1的值, 如果为真, 则执行表达式2，并返回表达式2的结果 ; 如果表达式1的值为假, 则执行表达式3 ，并返回表达式3的结果。查看全部
-
<body> <div>改变最后一行"苹果"背景颜色：</div> <ol> <li>葡萄</li> <li>香蕉</li> <li>橘子</li> <li>西瓜</li> <li>苹果</li> </ol> <script type="text/javascript"> $("li:last").css("background-color", "red"); </script> </body>查看全部
-
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>挑战题</title> </head> <ul> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> <li>6</li> <li>7</li> <li><a href="#">更多</a></li> </ul> <script> $(function(){ $("li:gt(4):not(li:last)").hide(); $("li a").click(function(){ var html=$(this).html(); if(html=="更多"){ $(this).html("简化"); $("li").show(); }else if(html=='简化'){ $(this).html("更多"); $("li:gt(4):not(li:last)").hide(); } }); }); </script> </html>查看全部
-
<body> <div class="red">选我吧！我是red</div> <div class="green">选我吧！我是green</div> <div class="blue">选我吧！我是blue</div> <script type="text/javascript"> $(".red,.green").html("hi,我们的样子很美哦!"); </script> </body>查看全部
-
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>挑战题</title> </head> <body> <script type="text/javascript"> $("a").click(function(){ if($(this).text() == '更多'){ $("li:hidden").show(); $("a").html('简化'); }else{ $("li:not(:last-child)").hide(); $("li:not(:gt(4))").show(); $("li").last().show(); $("a").html('更多'); } }) </script> <ul> <li>1</li> <li>1</li> <li>1</li> <li>1</li> <li>1</li> <li>1</li> <li>1</li> <a href="" id="a">更多</a> </ul> </body> </html>查看全部
-
<script type="text/javascript"> $("form *").attr("disabled", "true"); </script>查看全部
-
<html> <head> <title>.class选择器</title> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script> <link href="style.css" rel="stylesheet" type="text/css" /> </head> <body> <div class="red">立正，向我这边看齐</div> <div class="green">我先歇歇脚</div> <script type="text/javascript"> var $redHTML = $(".green").html(); $(".red").html($redHTML); </script> </body> </html>查看全部
举报
0/150
提交
取消