<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
* {
margin: 0;
padding: 0;
font-size: 0
}
.i {
width: 200px;
height: 200px;
/* border: 1px solid orangered; */
background-color: #000;
/* float: left; */
margin: 0;
border: 0
}
.div {
margin: 200px;
width: 200px;
padding: 100px;
border: 1px solid black;
position: relative;
}
.div2 {
margin: 200px;
width: 200px;
padding: 100px;
border: 1px solid black;
float: left;
}
</style>
</head>
<body>
<video src="./1.mp4" width="500" height="500" controls></video>
<img src="./1_answer_a.png" alt="" class="i">
<div class="div2">
<div class="div">
<div class="div">
<img src="./1_answer_b.png" alt="" class="i" onclick="drag()">
</div>
</div>
</div>
<div class="div2">
<div class="div2">
<div class="div2">
<img src="./1_answer_b.png" alt="" class="i" onclick="drag()">
</div>
</div>
</div>
</body>
<script>
function drag(e) {
e = e || window.event;
console.log(e.target);
console.log(e.target.offsetLeft);
console.log(getOffsetLeft(e.target));
}
function getOffsetLeft(obj) {
let tmp = obj.offsetLeft;
let val = obj.offsetParent;
while (val != null) {
tmp += val.offsetLeft;
val = val.offsetParent;
}
return tmp;
};
let arr = [
[0, 1, 1],
[1, 1, 0],
[1, 0, 0]
]
[
[1, null, null],
[0, 0, 1],
[1, null, null]
]
[
[1, 0, 1],
[1, 0, 1],
[0, 1, 0]
]
function isOk(arr) {
let total = 0
for (var i = 0; i < arr.length; i++) {
// if(){
// }
total += i;
}
console.log(i)
}
</script>
</html>