我想採用CSS選擇器,屬性和值,並使用jQuery或Javascript將其添加到HTML。使用Javascript或jQuery將CSS添加到所有HTML元素
我至今嘗試過是這樣的:
function toggleCSS() {
var preview = document.getElementById("preview");
var previewChildren = document.getElementById("preview").querySelectorAll("*"); // Get all of the elements created in the preview from the users HTML input
var cssToAdd = document.getElementById("cssTextArea").value; // The user is going to type in regular CSS into a textarea, and here I am retrieving the value they typed in
$(previewChildren).each(function() {
$(this).css(); // Looping through each node
});
}
例輸入: (HTML)
<html>
<head>
<title>Test</title>
</head>
<body>
<div>
Hello World!
</div>
<div id="TestDiv">
This is a test!
</div>
</html>
(CSS)
#TestDiv {
background-color: red;
}
我被陷在添加CSS的一部分。我在變量cssToAdd中有原始輸入,但是如何翻譯該CSS以獲取選擇器並將該選擇器中的屬性添加到每個HTML元素?
無論你想要做什麼,都需要更詳細的解釋,因爲目前還不是很清楚。破損的代碼不能很好地替代正確的解釋 – charlietfl
對於開始'document.getElementById(「preview」)''會引發一個問題,因爲你沒有帶'ID'預覽的元素。如果你希望顯示一個例子,請確保它在工作順序或JavaScript是一個匹配的HTML。 – NewToJS
@NewToJS HTML元素「預覽」與問題無關。如果我添加了所有內容,它會混淆這個問題。 – Dom