锋利的Jq 第八章实战总结

断断续续大半个月总算看完了这本书，记录一下中间的心得和踩过的坑。

github 实例地址：

https://github.com/SuYaru/Pre/tree/master/Fenli08

实际效果

1、首页左侧最新动态

过去只是知道 appendTo 是向父节点添加子类节点的一种方式，这里竟然可以直接将子节点移动

2、详细页点击颜色切换图片以后，对于不能访问的情况

chrome 报错

Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

有说修改 chrome 目标属性的 ，几乎都是这种解决办法

https://blog.csdn.net/superit401/article/details/72772658

https://blog.csdn.net/okgoodyes/article/details/38383367

然而并没有用，因为编译器用的是 vscode，最后安装扩展 Live Server ，成功解决

https://blog.csdn.net/katecatecake/article/details/79045211

3、五角星的触发效果

    每个五角星都是一个 a ，点击的时候触发 a 的效果

     0）对初始化的每个a ，设置递增的 left 距离

     1）根据 li 一列下来不同class 赋予不同的 hover 效果

     2）点击后 给 ul 增加不同的类（向上缩进不同的距离）

     3）ul 不同类的背景属性：background-position 0（== left ） 0（== top ）

4、要记得<del>标签，同样有删除样式

detail 样式中没有设置 ：text-decoration:line-through 。

5、还有就是，各种快速填充快捷键

切换下一行：shift + enter

删除当前行：ctrl+Y

当前行内容复制到下一行：ctrl+D

alt + shift + 鼠标左键：像 单按 alt 一样选中某一列

快速写ul：ul.menu>li*6>a[href=#]{内容} 按tab键 

                  [属性：alt 属性一般不写，都自带有]，{文本内容（$从1开始自增填充）}

ul>li.item$@3*5：class从 item3 向后5个数

+ 并列标签  ^ 找父级

连续两个 .类1.类2 ：同时增加多个类