2.JSJQ课程期末复习之复习JS2

1.dom包括css-dom和html-dom

 document.html.head.title.body.h1#下面才是常用的
document.getElementById("p2").style.color="blue";
document.getElementById("p2").style.fontFamily="Arial";
document.getElementById("p2").style.fontSize="larger";

2.节点的属性

getElementsByName(“”).
parentNode
childNodes
firstChild第一个孩子 || firstElementChild 可以解决兼容性问题
lastChild || lastElementChild
nextSibling 下一个兄弟
previousSibing || previousElementSibing
nodeType 1是一个元素 2 3是文本
nodeName type为3 为 #text
nodeValue 是text的话可以拿到节点里面的文本

3.只保留2位小数

 .toFixed(2);

4.操作节点

属性
html:
name=“book”;
name=“book”;
js:
.getAttribute(“xxx”);
.setAttribute(“src”,“./dogdog.jpg”);
book[0].check

创建节点
document.getElementsByTagName(“div”)[0];
document.createElement(“img”);
.appendChild(img);
//克隆
xx.cloneNode(false);
xx.insertBefore(copyNode,xx.firstChild);//要在一个节点下,第三个是节点的插入位置

删除节点
xxNode=xxxgetElement();//必须先得到节点
xxNode.parentNode.removeChild(xxNode);//父节点删除子节点
oldNode.parentNode.replaceChild(newNode,oldNode);//

3.改变样式属性

.style.color=‘#aaaaa’;
.backgroundColor=“#xxxxxx”
.zIndex=“100”
.borderBottom=“none”; //底边框 solid 1px #aaa
.display=“none”; //block显示
.position=“relative”;
.top=“10px”;
.className=“xxx”;

3.事件 οnmοuseοver=“over” 在上面 οnmοuseοut=“out” 离开
4.在html可以写this,代表当前这个元素的对象

 <div id="cart"><p onclick="del(this)"></p></div>del(obj){var delNode=obj.parentNode;delNode.parentNode.removeChild(delNode);

5.js改变元素(css参数的驼峰命名)

  xxdom.style.color="#aaa";.className="";.currentStyle#浏览器兼容.value 获取表单的值.setAttribute("src","image/dog.jpg");}

6.随机数

   Math.floor(Math.radom()*4);  //[0-4)//div添加img节点div.appendChild(img);

7.滚动位置(相当于css的position:fixed的js实现) 需要兼容谷歌和火狐和ie

document.body.scrollTop;function cl(){document.querySelector("#float").style.display = "none"document.querySelector("#close").style.display = "none"
}
function place(){console.log("aaa");closeObject = document.querySelector("#close");floatObject = document.querySelector("#float");//支持IEif(closeObject.currentStyle){console.log("aaa1");console.log(closeObject.currentStyle.style);closeTop=closeObject.currentStyle.top;closeLeft=floatObject.currentStyle.left;floatTop=closeObject.currentStyle.top;floatLeft=floatObject.currentStyle.left;}else{closeTop = parseInt(document.defaultView.getComputedStyle(closeObject,null).top)//支持IE9以上版本,支持火狐,只读属性closeLeft = parseInt(document.defaultView.getComputedStyle(closeObject,null).left)floatTop = parseInt(document.defaultView.getComputedStyle(floatObject,null).top)floatLeft = parseInt(document.defaultView.getComputedStyle(floatObject,null).left)}}
function roll(){console.log("bbb");let closeScrollTop = parseInt(document.documentElement.scrollTop||document.body.scrollTop)let closeScrollLeft = parseInt(document.documentElement.scrollLeft || document.body.scrollLeft)let floatScrollTop = parseInt(document.documentElement.scrollTop||document.body.scrollTop)let floatScrollLeft = parseInt(document.documentElement.scrollLeft||document.body.scrollLeft)closeObject.style.top = closeTop+closeScrollTop+"px";closeObject.style.left = closeLeft+closeScrollLeft+"px";floatObject.style.top = floatTop+floatScrollTop+"px";floatObject.style.left = floatLeft+floatScrollLeft+"px";
}window.onload = place; //启动时加载这个函数
window.onscroll = roll;  //监听函数,如果滚动条滚动可以调用函数

8.js script标签写了src,里面不能写内容 !!!

2.JSJQ课程期末复习之复习JS2相关推荐

1.JSJQ课程期末复习之复习JS
1.加强for var b=new Array(10);var a=["aaa","bbb"];for(var i in a){} 2.continue和bre ...
郦旭东小可爱的大数据算法课程期末复习
郦旭东小可爱的大数据算法课程期末复习 kmeans问题 kmeans原始问题和kmeans alg算法问题 kmeans问题 kmeans原始问题和kmeans alg算法问题 kmeans 原始问题 ...
【期末复习】北京邮电大学《数字内容安全》课程期末复习笔记（5. 社交媒体安全）
[相关链接] [期末复习]北京邮电大学<数字内容安全>课程期末复习笔记(1. 绪论) [期末复习]北京邮电大学<数字内容安全>课程期末复习笔记(2. 信息隐藏与数字水印) [期 ...
【期末复习】北京邮电大学《网络安全》课程期末复习笔记（9. 虚拟专用网络）
[相关博客链接] [期末复习]北京邮电大学<网络安全>课程期末复习笔记(1. 网络安全概述) [期末复习]北京邮电大学<网络安全>课程期末复习笔记(2. 恶意代码) [期末复习 ...
【期末复习】北京邮电大学《数字内容安全》课程期末复习笔记（4. 多媒体安全）
[相关链接] [期末复习]北京邮电大学<数字内容安全>课程期末复习笔记(1. 绪论) [期末复习]北京邮电大学<数字内容安全>课程期末复习笔记(2. 信息隐藏与数字水印) [期 ...
【期末复习】北京邮电大学《数字内容安全》课程期末复习笔记（2. 信息隐藏与数字水印）
[相关链接] [期末复习]北京邮电大学<数字内容安全>课程期末复习笔记(1. 绪论) [期末复习]北京邮电大学<数字内容安全>课程期末复习笔记(3. 文本安全) [期末复习]北 ...
石川es6课程---18、ES6 复习
石川es6课程---18.ES6 复习一.总结一句话总结: 无论在讲课和学习中,复习总结都是很重要二.ES6 复习变量 let const 声明方式能否重复声明作用域类型是否支持变量提 ...
计算机应用基础课程没有期末考试,《计算机应用基础》课程期末考试2009—2010学年第一学期.doc...
<计算机应用基础>课程期末考试2009-2010学年第一学期.doc 对外经济贸易大学远程教育学院 2009-2010学年第一学期 <计算机应用基础>课程期末考试复习大纲期 ...
北邮研究生《计算机网络原理》课程期末通过经验
<计算机网络原理>期末考试通过经验 2020 算是好不容易通过了惊心动魄的一门传奇课的日后谈 "过经"? 课程详情北京邮电大学计算机学院计算机学硕 <计算机 ...

2.JSJQ课程期末复习之复习JS2

2.JSJQ课程期末复习之复习JS2相关推荐

最新文章

热门文章