这个脚本是我写的。但现在我需要将这些 id 转换为类,因为我应该将其放入页面的其他元素中。
卡 ---> .card
翻转 ---> .flip
var init = function() {
var card = document.getElementById('card');
document.getElementById('flip').addEventListener( 'click', function(){
card.toggleClassName('flipped');
}, false);
};
window.addEventListener('DOMContentLoaded', init, false);
你能帮我吗?
解决方案:
$(function() {
var card = $('.card');
$('.flip').on( "click", function(){
card.toggleClass('flipped');
return false;
});
});
最佳答案
由于您已标记 jquery ,我会给这个:
// Once document is loaded,
$(function () {
// Change all the `#card`, `#flip` to classes:
$("#card, #flip").addClass(function () { return this.id; }).removeAttr("id");
});
首先它选择所有的#card
和#flip
,应该只有2个元素。它将各自的 id
添加为 class
并删除 id
属性。
片段
// Once document is loaded,
$(function () {
// Change all the `#card`, `#flip` to classes:
$("#card, #flip").addClass(function () { return this.id; }).removeAttr("id");
});
.card {background: #f99;}
.flip {background: #9f9;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="card">Card</div>
<div id="flip">Flip</div>
如果你只是想添加额外的类,那么你可以使用这个:
$(function() {
var card = $('.card');
$('.flip').on( "click", function(){
card.toggleClass('flipped');
return false;
});
});
关于javascript - Jquery/Javascript(从 ID 转换为类),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34225639/