jquery简单选择器

最新推荐文章于 2022-11-18 23:35:14 发布

WTT

最新推荐文章于 2022-11-18 23:35:14 发布

阅读量472

点赞数

文章标签： jquery button div function class border

本文链接：https://blog.csdn.net/w19911111/article/details/7380676

版权

•jQuery基本选择器：

$(“#id”): 根据给定的id匹配一个元素

$(“.myclass”):根据类名匹配元素

$(“*”): 选取html页面中所有的元素

$(“div”):选取html页面中所有的div元素

$(“div,span,myclass”):选取所有的<div><span><myclass>一组元素

</style>

//使用jquery加载事件
$(document).ready(function (){

//<input id="btn0" type="button" value="清空样式" />
$("#btn0").click(function (){

  //当点击按钮后，设置id=two的div的背景颜色是绿色
  $("*").removeAttr("style");

});

//<input id="btn1" type="button" value="选中id=two的div，并且改变背景颜色是green (#two)" />

//增加id为btn1按钮的事件
$("#btn1").click(function (){

  //当点击按钮后，设置id=two的div的背景颜色是绿色
  $("#two").css("background","green");

});

//<input id="btn2" type="button" value="选中class=one-1的div,并且设置该div的背景颜色为green ('.one-1')" />
//增加id为btn1按钮的事件
$("#btn2").click(function (){

  //当点击按钮后，设置id=two的div的背景颜色是绿色
  $(".one-1").css("background","green");

});

//<input id="btn3" type="button" value="选中页面中所有的元素，并且设置背景颜色为green ('*')" />
//增加id为btn1按钮的事件
$("#btn3").click(function (){

  //当点击按钮后，设置id=two的div的背景颜色是绿色
  $("*").css("background","green");

});

//<input id="btn4" type="button" value="选中所有的div $('div')" />

//增加id为btn4按钮的事件
$("#btn4").click(function (){

  //当点击按钮后，设置id=two的div的背景颜色是绿色
  $("div").css("background","green");

});

//<input id="btn5" type="button" value="选中id=three,class=one-1的，span的元素，并且设置他们的背景颜色为green" /></div>

//增加id为btn5按钮的事件
$("#btn5").click(function (){

  //当点击按钮后，设置id=two的div的背景颜色是绿色
  $("#three,.one-1,span").css("background","green");

});

});

</script>

</head>

<body>
<div id="one">id=one
<div class="one-1">class=one-1</div>
</div>
<div id="two">id=two<span>span的内容</span></div>
<div id="three">id=three</div>
<div class="d2">class=d2</div>

WTT

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jquery简单选择器

•jQuery基本选择器： $(“#id”): 根据给定的id匹配一个元素 $(“.myclass”):根据类名匹配元素 $(“*”): 选取html页面中所有的元素 $(“div”):选取html页面中所有的div元素 $(“div,span,myclass”):选取所有的一组元素 div{ width:150
复制链接

扫一扫