簡単な要約のフロントエンド
A、n番目の子()と第nの型()
CSS擬似クラスは、n番目の子()と第nの型()を選択しました。前者は、最初のタグが最初に一致した一致するタグで、括弧内の位置を見つけ、その後、ラベル内の場所を見つけます。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>复习</title>
<style>
/*先位置,后匹配:先找到第4个标签,再匹配选择器对象*/
p:nth-child(4) {
color: red;
}
a {
color: inherit;
}
/*先匹配,后位置:先把所有p标签意外的标签屏蔽(只匹配p标签),再匹配位置*/
p:nth-of-type(2){
color: orange;
}
</style>
</head>
<body>
<div>
<a href="">a111</a>
<p>p111</p>
<a href="">a222</a>
<p>p222</p>
</div>
</body>
</html>
二、html
htmlの一般的に使用されるタグ
html head body
div span
br hr
a img
i b u
h1~h6 p
ul li
table thead tbody tfoot tr th td
form input label textarea select option
三、CSS
CSSセレクタ
基础:* div .div #div !important
群组:div,h1,a {}
后代:body div body > div
兄弟:.d1~d2 .d1+.d2
交叉选择器:.d1.d2 | div.d1 div.d1#d.d2 <div class="d1 d2" id="d">
属性选择器:[titile]
伪类选择器::hover :active :focus :blur :change :checked
:after{content:""} :before{content:""}
:nth-child() :nth-of-type()
四、JS
:4つの変異体、jsのストリング、アレイ、オブジェクトの操作方法、可変長パラメータJSでJS
function f() {
let a = 1; // 不可以重复声明
var b = 2; // 可以重复声明 var b = 4;
const c = 3; // 常量
d = 4; // 全局
}
f();
console.log(d);
{
let a = 1;
var b = 2;
}
console.log(b);
''.split();
'' + '';
''.slice();
''.length;
// for in | for of
[].join();
[].push();[].unshift();
[].pop();[].shift();
// [].splice(bIndex, length, args)
[].sort();
let g = {};
g['key'];
g.key;
delete g.key;
function f1(...a) {
console.log(a)
}
f1(1, 2, 3, 4);