项目/技术
一、跨域
1、同源策略
浏览器同源策略限制请求
同源是指"协议+域名+端口"三者相同，即便两个不同的域名指向同一个ip地址，也非同源。
2024年11月27日
本内容是《Web前端开发之Javascript视频》的课件，请配合大师哥《Javascript》视频课程学习。
HTML5规范围绕着如何使用新增标记定义了大量Javascript API；其中一些API与DOM重叠，定义了浏览器应该支持的DOM扩展；
从HTML4开始，在Web开发领域，有一个非常大的应用，就是滥用class属性，一方面可以通过它为元素添加样式，另一方面还可以用它表示元素的语义；于是，开发人员会用大量的Javascript代码来操作CSS类，比如动态修改类或者搜索文档中具有给定类或给定的一组类的元素，等等这些操作；为了让开发人员适应并增加对class属性的新的认识，HTML5新增了很多API，致力于简化CSS类的用法；
2024年11月27日
最近我在CodePen上发现了一个纯CSS实现，具有渐变倒影和3D旋转效果的栅栏动画，他的实现方式是：利用10个<div>元素创建10个栅条，接着再复制整份<div>元素，并创建一个渐变遮罩形成渐变效果，以此作为栅栏的倒影。
这听起来有点像用左脚的脚趾去抓你的右耳背部（译者理解：表达的意思应该是用了复杂的方式去处理一个其实可以用简单方式达成的事情）！更不用说这种渐变遮罩的方式根本不适用于非单一颜色的背景。难道没有基于CSS的更好的方法吗？
2024年11月27日
relative或absolute
马克-to-win：如何放置绝对正中的位置。项目心得：正常来讲，div绝对定位默认的是以body标签为参照，而且无论你的绝对定位的div外面有几层父div，但是当你把其中一个父div设置成position:relative;那么被绝对定位的div就会以这个div为参照。比如项目中 index.html中的mysubtop1这个div就必须设成relative，它里面的div才会以它为参照系。
例 1.4.1
2024年11月27日
很多前端小伙伴都知道关于页面动画时候，transform 性能好。
但是为什么 transform 性能好，认知可能停留在这些信息上：
1、transform 不会引起回流与重绘
2、transform 会进行 GPU 加速
没了……
上面的答案是对的，但不够深入，我们现在进行更详细的说明，让你了解的更加透彻。
2024年11月27日
position:
position属性取值：static(默认)、relative、absolute、fixed、inherit、sticky。
2024年11月27日
在 html 页面的css样式中，如果将 position 属性的值设置为 fixed，那就表示其元素的位置相当于显示设备的可视区域进行定位，而今天在调试此属性时，却发生了一件奇怪的事件。
失效代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<style>
body{
height: 150%;
width: 100%;
transform: translate(0, 0);
}
div{
position: fixed;
left: 50%;
top: 50%;
width: 100px;
height: 200px;
margin: -100px 0 0 -50px;
background-color: brown;
}
</style>
<body>
<div></div>
</body>
</html>
2024年11月27日
CSS position属性中absolute和relative很容易让人弄混，基本的概念什么着，你去参考W3C，就不啰嗦了
--------------------------------------------------------------------------------------------------------------------------------------------
1. static 默认值。没有定位，元素出现在正常流中（忽略top，bottom，left，right或者z-index声明）