js新增 刪除 keyframes

@keyframes規則是用來定義css動畫：

@keyframes name

50%100%
}

div

解決思路：

1、首先我們需要獲取css的樣式表

// 獲取所有css樣式表

let styles = document.stylesheets;

stylesheetlist

這其實是乙個object型別而不是array型別。stylesheetlist物件中的cssstylesheet就是一張樣式表（按style、link標籤為單位生成?）。

2、根據這個stylesheetlist物件，篩選需要新增到的cssstylesheet中（這不主要是為了規範，其實放**都一樣）

// 根據href

let style =
null
;for
(p in styles)
}

style.

insertrule
(`@keyframes name 
20% 
100% 
}`,0
);

csskeyframesrule ↵ 100% ↵}", parentrule: null, …}

insertrule在cssstylesheet中生成了乙個csskeyframesrule

4、如果要刪除css規則，則通過cssstylesheet的removerule(index)即可。不過需要遍歷一下cssstylesheet.name在查詢需要刪除rule的index

5、其實直接js動態生成乙個style標籤會比較簡單，通用

用這個寫了乙個字幕輪播效果：

js修改 新增css3 keyframes

var style document.createelement style style.type text css style.innerhtml body 你要插入的樣式 簡單介紹原理就是重新插入一段css樣式，達到建立keyframes的目的。另外還有利用 document.styleshee...

JS陣列新增刪除

棧是一種後進先出的資料結構 lifo，last in first out push 末尾新增 pop 末尾刪除 shift 頭部刪除 unshift 頭部新增 unshift 比push 慢100倍，可以先使用reverse 反轉再使用push 但是我要找的是向指定位置插入資料 理論上增刪替換都能用...

JS新增和刪除節點

1 doctype html 2 html 3 head 4 meta charset utf 8 5 title 無標題文件 title 6 div id div1 7 p id p1 這是乙個段落 p 8 p id p2 這是另乙個段落 p 9div 10head 1112 body 13 sc...