<button class="fa fa-heart" id="btnRight">右</button>
// 选择器
var Q = function (id) {
return document.getElementById(id)
};
以下代码中的//选择器部分的代码，怎么改成依据button内class="fa fa-heart"的方式，最好全部改写成jquery的啊～
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://www.jq22.com/demo/mSlider201807232231/mSlider.min.js"></script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<html>
<head>
<meta charset="utf-8">
<title>侧边滑出弹层插件--mSlider.js</title>
<style>
.wrap>div {
opacity: 0;
padding: 10px;
}
@media screen and (max-width:640px) {
button {
width: 100%;
margin: 2% auto;
padding: 10px;
}
}
</style>
</head>
<body>
<i class="fa fa-heart"></i>
<div class="container">
<button id="btnRight">右</button>
</div>
<div class="wrap">
<div id="commbox">
<h3>右侧弹层内容...</h3>
</div>
</div>
<script>
window.onload = function () {
//移动端使用touchend
var event = navigator.userAgent.match(/(iPhone|iPod|Android|ios)/i) ? 'touchend' : 'click';
// 选择器
var Q = function (id) {
return document.getElementById(id)
};
//方向控制
//右
var _right = new mSlider({
dom: "#commbox",
direction: "right"
});
Q("btnRight").addEventListener(event, function (e) {
_right.open();
})
}
</script>
</body>
</html>
