杂项

两个数的置换

在算法里呢!


取整 (骚操作)

取反取反

1
2
3
var a = 1.999;
/*取整*/
console.log(~~a);

表格中插入

前提:body 中已经写好了 tr 和 td
重要知识点:

1
2
3
4
5
6
7
8
9
10
<script>
for(var i = 0;i < $("tr").length;i++){
var obj = Object.keys(arr[i]);
/*tr[0].children.length();这个是找到此节点中的所有元素*/
for(var j = 0;j < $("tr")[i].children.length;j++){
/*这个是Object.keys(obj) 这个是提取出来所有 key 并且是数组*/
$("tr")[i].children[j].innerText = arr[i][obj[j]];
}
}
</script>

iframe 内嵌页

a 标签相类似,最重要的属性还是 src
frameborder 规定是否显示框架周围的边框,值为 1 或 0

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
//这里做几个按钮切换网页的效果
<body>
<div class="one">
<button>change0</button>
<button>change1</button>
<button>change2</button>
</div>
<iframe src="" frameborder="0" width="100%" height="560"></iframe>
<div class="two"></div>
</body>

<script>
var btn = document.querySelectorAll("button");
var ifr = document.querySelector("iframe");
var arr = ["demo1.html","demo2.html","https://www.baidu.com"];
btn[0].onclick = function () {
ifr.src = arr[0];
};
btn[1].onclick = function () {
ifr.src = arr[1];
};
btn[2].onclick = function () {
ifr.src = arr[2];
}
</script>

旋转

有几个

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
<head>
<meta charset="UTF-8">
<title>旋转</title>
<style>
.box{
width: 300px;
height: 300px;
position: absolute;
top: 50%;
left: 50%;
border-radius: 10px;
transform: translate(-50%,-50%);
}
.item{
width: 300px;
height: 300px;
position: absolute;
left: 0;
top: 0;
border-radius: 10px;
/*背面隐藏*/
backface-visibility: hidden;

cursor: pointer;
/*只要变化的就能设置,比如:宽高透明度等
设置多个就用all*/
transition: transform 3s;
}
.div1{
background:-webkit-linear-gradient(orange,red) no-repeat;
transform: rotateY(180deg);
}
.div2{
background:-webkit-linear-gradient(#6441A5,#2a0845) no-repeat;
}
</style>
</head>

<body>
<div class="box">
<div class="div1 item"></div>
<div class="div2 item"></div>
</div>
</body>

<script>

var div1 = document.querySelector(".div1");
var div2 = document.querySelector(".div2");
div1.onclick = function () {
div1.style.transform = "rotateY(180deg)";
div2.style.transform = "rotateY(0deg)";
};
div2.onclick = function () {

div2.style.transform = "rotateY(180deg)";
div1.style.transform = "rotateY(0deg)";
}
</script>