這個JQuery代碼可以使用純Javascript編寫嗎？

-2

有沒有一種方法可以將這段代碼表示爲普通的vanilla Javascript，這樣我就可以更好地理解它現在的工作原理了嗎？這個JQuery代碼可以使用純Javascript編寫嗎？

$("#id").click(function(){ 
    var $x = $("#id"); 
    $x.removeProp("-webkit-animation"); 
});

基本上我用這個來告訴代碼不要播放css動畫，因爲滿足了一定的參數集。

來源

2015-05-20 Caleb Whittington

哪一部分做不是有點相當於你知道該怎麼做lain Javascript？點擊處理程序？刪除一個屬性？你有什麼研究和嘗試？ StackOverflow期望您在發佈之前自己完成基礎研究，然後提出有關您確切位置卡住的問題。 – jfriend00

歡迎來到Stack Overflow！正如附註一樣，您可以使用JavaScript來處理JQuery。 JQuery在後端是JavaScript，它只是創建一個簡寫，所以我們不必這麼努力！ – zfrisch

@ jfriend00對不起，正如我所說我是JavaScript新手，所以遇到了麻煩。我做了研究，但我不知道很多JavaScript，找不到任何有用的東西。很抱歉給大家帶來不便。 –

removeProp removes properties of objects.如果這絕對你想要的，相當於是delete操作：

var element = document.getElementById("id"); 

element.addEventListener("click", function() { 
    delete element["-webkit-animation"]; 
});

如果你真正想要做的是改變CSS財產，不過，它需要一個操作上元素的style：

element.style.WebkitAnimation = "none";

但你應該做的是改變一個類，而不是：

element.classList.add("no-animation");

和使用CSS：

.no-animation { 
    -webkit-animation: none; 
}

來源

2015-05-20 17:01:13 Ryan

非常感謝！我一直在試圖解決這個問題很長一段時間 –

是的，你可以使用.removeAttribute() function刪除屬性，如風格，標題等

或者您可以使用.removeProperty()刪除樣式屬性（支撐在IE9及以上）

Fiddle

(function() { 
 
var myDiv = document.getElementById('myDiv'); 
 
myDiv.removeAttribute('style'); 
 

 
var aDiv = document.getElementById('aDiv'); 
 
aDiv.style.removeProperty('height'); 
 
})();

<div id="aDiv" style="background-color: green;">Hi</div> 
 
<div id="myDiv" style="background-color: green;">Hi</div>

來源

2015-05-20 17:03:07 JasonWilczak

的delete元素是香草的javascript removeProp()

element = document.getElementById('id'); 
element.onclick() = function(){ 
    delete element['-webkit-animation']; 
}

來源

2015-05-20 17:04:01 codeninja

希望這將有助於OP

var element = document.getElementById("id"); 

element.onClick = function(){ 
    this.style.removeProperty("-webkit-animation"); 
};

來源

2015-05-20 17:04:13

我不相信有'removeProperty（）'方法 - 儘管我還沒有試圖運行這個代碼。但它似乎並未列入MDN。 –

@DavidThomas：它確實存在。在https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleDeclaration上列出但未詳細記錄。 – Ryan

@minitech：所以我看到 - 我試圖在JS Fiddle中運行張貼的代碼片段，雖然它沒有「工作」，但沒有產生錯誤（一旦'id'被糾正，'＃'被移除）。無論如何：[代表性演示]（http：// jsfiddle。net/davidThomas/dfjm23kL/1 /），使用'color'代替'-webkit-animation'。 –

這個JQuery代碼可以使用純Javascript編寫嗎？

回答

相關問題