杂项
两个数的置换
在算法里呢!
取整 (骚操作)
取反取反
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]); for(var j = 0;j < $("tr")[i].children.length;j++){ $("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;
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>
|