jQuery学习笔记02:核心部分

举报
howard2005 发表于 2021/11/19 03:34:14 2021/11/19
【摘要】 jQuery学习笔记:核心部分 一、$(expr) 1、说明 $(expr) 该函数通过CSS选择器、XPath或html代码来匹配目标元素 参数:expr(字符串,一个查询表达式或一段html字符串) 2、案例演示 <!DOCTYPE html><html lang="en"><head&...

jQuery学习笔记:核心部分

一、$(expr)

1、说明

$(expr) 该函数通过CSS选择器、XPath或html代码来匹配目标元素

参数:expr(字符串,一个查询表达式或一段html字符串)

2、案例演示


  
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>demo1_1</title>
  6. <script src="js/jquery-3.4.1.js"></script>
  7. </head>
  8. <body>
  9. <!--
  10. $(expr) 该函数通过CSS选择器、XPath或html代码来匹配目标元素
  11. 参数:expr(字符串,一个查询表达式或一段html字符串)
  12. -->
  13. <p>jQuery is so useful.</p>
  14. <div>
  15. <p>I want to learn jQuery.</p>
  16. </div>
  17. <p>How can I learn jQuery well?</p>
  18. <button id="set" onclick="set()">Set an Element</button>
  19. <button id="add" onclick="add()">Add an Element</button>
  20. <script>
  21. function set() {
  22. let elem = $('div > p');
  23. alert(elem.html());
  24. elem.css({color: 'red', 'font-weight': 'bold'});
  25. }
  26. function add() {
  27. let elem = $('<div><p>Good morning everyone~</p></div>');
  28. elem.appendTo("body");
  29. }
  30. </script>
  31. </body>
  32. </html>

单击【Set an Element】按钮,弹出一个消息框,并且将第二个段落字体颜色设置为红色:

单击【Add an Element】按钮,添加一个段落元素:

 

文章来源: howard2005.blog.csdn.net,作者:howard2005,版权归原作者所有,如需转载,请联系作者。

原文链接:howard2005.blog.csdn.net/article/details/103065044

【版权声明】本文为华为云社区用户转载文章,如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。