Browse Source

7.2

zhangyong
ZhangYong 2 months ago
parent
commit
e3aa69d5bf
  1. 44
      src/jsStudy/Math.html
  2. 77
      src/jsStudy/dom获取元素.html
  3. 71
      src/jsStudy/jsStudy.html

44
src/jsStudy/Math.html

@ -0,0 +1,44 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
console.log(Math.abs(-2));//去绝对值
console.log(Math.min(10,11,12,16,48,2));//取最小值
console.log(Math.max(10,11,12,16,48,2));//取最大值
console.log(Math.floor(10.1));//向下取整
console.log(Math.ceil(10.1));//向上取整
console.log(Math.random())//取0~1之间的随机数
function getRandomNum(min,max){
//random*(最大值-最小值)+最小值
return Math.floor(Math.random()*(max-min)+min);
}
var n = getRandomNum(10,20);
console.log(n);
//Date
console.log(Date.now());
console.log(new Date(Date.now()));
console.log(new Date(1751436462638).getDate());//2
console.log(new Date(1751436462638).getTime());
console.log(new Date(1751436462638).getMonth());//0~11代表一到十二月
console.log(new Date(1751436462638).getFullYear());//年
console.log(new Date(1751436462638).getHours());//时
console.log(new Date(1751436462638).getMilliseconds());//毫秒
console.log(new Date(1751436462638).getMinutes());//分
console.log(new Date(1751436462638).getSeconds());//秒
</script>
</body>
</html>

77
src/jsStudy/dom获取元素.html

@ -0,0 +1,77 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- dom节点的类型
Document:文档树的顶级节点
DocumentType:doctype标签
Element:网页的html标签
Attribute:元素属性
Text:标签之间的文本
Comment:标签注释
DocumentFragment:文档片段 -->
<div>div1</div>
<div>div2</div>
<div class="haha"></div>
<form name="login"></form>
<div class="div1" id="mike"></div>
<p class="haha"></p>
<script>
//1.getElementsByTagName
var div1 = document.getElementsByTagName("div")[0]
console.log(div1);
//2.getElementsByClassName
console.log(document.getElementsByClassName("haha")[0]);
//3.getElementsByName
console.log(document.getElementsByName("login")[0]);
//4.getElementById
console.log(document.getElementById("mike"));
//5.querySelector(".haha")
console.log(document.querySelector(".haha"))
//6.querySelectorAll(".haha")
console.log(document.querySelectorAll(".haha"));
//创建元素
var p = document.createElement("p");
var content = document.createTextNode("woshineirong");
var id = document.createAttribute("id");
id.value = "root "
p.appendChild(content);
p.setAttributeNode(id) //只有在属性的添加是用
console.log(p);
var dd = document.getElementById("mike")
dd.appendChild(p)
//元素的属性
var d0 = document.getElementById("mike");
d0.id = "dd1"
d0.className = "dd0 dd1"
d0.classList.add("ss1")
console.log(d0.classList);
d0.classList.remove("ss1")
console.log(d0.classList);
// innerHTML可以识别标签,而innerText会把标签识别为一个字符串
var str = "<a href = 'www.baidu.com'>baidu</a>"
//d0.innerText = str; <a href = 'www.baidu.com'>baidu</a>
d0.innerHTML = str;
</script>
</body>
</html>

71
src/jsStudy/jsStudy.html

@ -0,0 +1,71 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
var name = "nihao"
console.log(name.substr(1, 5));//ihao
console.log(name.substr(2, 3));//hao
console.log(name.substr(1));//ihao
console.log(name.substr(-2));//ao
console.log(name.substr(2, -1));//
// -1表示不匹配,若存在第二个参数,代表从该位置开始匹配
console.log(name.indexOf("ao"))
console.log(name.indexOf("ao", 4))
// 去掉字符串前后的空格,不改变原字符串,返回改变后的字符串
var str = " haha nihaoa "
var str1 = " \nhaha nihaoa\r "
console.log(str.trim())
console.log(str1.trim())
console.log("hahaha|woshi|ll".split("|"))//['hahaha', 'woshi', 'll']
console.log("hahaha,|woshi|,ll".split(","))//['hahaha', '|woshi|', 'll']
console.log("hahaha|woshi|ll".split("|",2))//['hahaha', 'woshi']
var arr = ["kalka","adj",1,"jajajaj"]
for(var i in arr){
console.log(arr[i])
}
console.log(Array.isArray(arr))//true 判断是否为数组
var arr1 = [];
arr1.push("nishishei?","woyebuzhidao")
console.log(arr1)
arr1.pop()
console.log(arr1)//['nishishei?']
console.log("==============")
console.log(arr.shift())// 删除开头第一个元素,并返回该元素
arr.unshift("这是新的元素")//在开头添加一个元素
console.log(arr)
//数组方法join
var arr2 = [111,222,333,444]
var q = arr2.join("|")
console.log(q);
q=q.split("|")
console.log(q);
//cancat方法 数组合并
var arr3 = arr1.concat(arr2)
console.log(arr3);// ['nishishei?', 111, 222, 333, 444]
//reverse() 数组翻转,会改变原数组
console.log(arr3.reverse());//[444, 333, 222, 111, 'nishishei?']
//indexOf()查询某字段在数组中的位置,若存在返回其索引,否则返回-1
console.log(arr2.indexOf(2));
</script>
</body>
</html>
Loading…
Cancel
Save