2018-11-08jQuerY
口号：Write Less Do More
1.解决了浏览器兼容性问题
2.封装了常用的操作，用更少的代码做更多的事。
引入jQuery
1.使用自己项目中的jquery.min.js。
2.使用CDN服务器上的jQuery文件。
如何使用jQuery
jQuery对象的本质是一个伪数组
有length属性
可以通过下标获取数据
window.jQuery属性 --> $
1、$函数的参数是一个函数 - 传入的函数是页面加载完成之后要执行的回调函数
2、$函数的参数是选择器字符串 - 获得页面上的标签而且转换成JQuery对象。
说明：为什么要获取jQuery对象 - 因为jQuery对象有更多封装好的方法可供调用。
绑定/反绑定：on()/off()/one()
获取/修改标签内容：text()/html()
获取/修改标签属性：attr(name, value)
添加子节点：append()后 / prepend()前面
删除/清空节点：remove() / empty()
修改样式表：css({'color':'red',……}) - 修改多个样式 （一个参数是读样式，两个是修改样式）
获取节点：parent() / children() / prev() /next()
后两个是兄弟节点
3、$函数的参数是标签字符串 - 创建标签并且返回对应的jQuery对象。
4、$函数的参数是原生JS对象 - 将原生JS对象转换成JQuery对象。
【2018-11-08jQuerY】如果bar是一个jQuery对象 可以通过bar[0] / bar.get[0]
- 锐客网 * {
margin: 0;
padding: 0;
}
#container {
margin: 20px 50px;
}
#fruits li {
list-style: none;
width: 200px;
height: 50px;
font-size: 20px;
line-height: 50px;
background-color: cadetblue;
color: white;
text-align: center;
margin: 2px 0;
}
#fruits>li>a {
float: right;
text-decoration: none;
color: white;
position: relative;
right: 5px;
}
#fruits~input {
border: none;
outline: none;
font-size: 18px;
}
#fruits~input[type=text] {
border-bottom: 1px solid darkgray;
width: 200px;
height: 50px;
text-align: center;
}
#fruits~input[type=button] {
width: 80px;
height: 30px;
background-color: coral;
color: white;
vertical-align: bottom;
cursor: pointer;
}- 苹果×
- 香蕉×
- 火龙果×
- 西瓜×
推荐阅读
- 【C】题目|【C语言】题集 of ⑥
- Rewrite规则
- 培训为业务服务，不是一句口号，要真正做到，需要注意三个关键因素
- Java|Java JUC ReentrantReadWriteLock解析
- JAVA并发编程——ReentrantReadWriteLock锁降级和StampedLock
- Java|Java JUC CopyOnWriteArrayList 解析
- linux中readl()和writel()函数
- mysql|mysql double write
- Linux|__raw_writel, writel_relaxed 和 writel的区别
- idea使用tomcat访问html页面端口号是63342，直接输入8080无法访问的问题