jQuery常用dom操作
16lz
2021-04-24
1. jQuery常用dom操作
(1) 用$函数，比原生写法更简洁
- 原生: document.querySelectorAll(“.list .item”).forEach((item) => (item.style.color = “red”));
- jquery: $(“.item”, “.list”).css(“color”, “red”);
<ul class="list">
<li class="li item">item1</li>
<li class="li item">item2</li>
<li class="li item">item3</li>
</ul>
(2) 将原生js对象转换jQuery对象
$(document.body).css(“background-color”,”blue”);
(3) $(html文本): 创建dom元素,直接包装成jQuery对象返回
document.body.insertAdjacentHTML(“afterbegin”,”<p> let’s write more code</p>“);
$(“<p>let’s write more code</p>“).insertAfter(“.list”);
(4) $(回调): dom树一旦创建完成,就会立即执行这个回调
<script>
$(() => {
$(“body h2”).css(“color”, “red”);
});
</script>
<h2>have fun on the code writing</h2>
更多相关文章
- JavaScript:数学对象，随机生成数字验证码并且随机添加字体颜色
- Linux 文件目录管理——创建
- JavaScript:时间对象，实例演示右下角广告图
- kivy texture图片格式和opencv numpy图片格式互转
- Spring 获取 request 的几种方法及其线程安全性分析
- 死磕Spring之AOP篇 - Spring AOP常见面试题
- Spring小记
- spring工程搭建
- 企业sudo权限规划详解 (实测一个堆命令搞定)