慕课网

精品课程 JavaScript进阶篇

JavaScript进阶篇

最热最新

你是漂亮的天蓝色

1、JS获取浏览器窗口可视区域大小：
var w= document.documentElement.clientWidth || document.body.clientWidth;
var h= document.documentElement.clientHeight || document.body.clientHeight;
2、JS获取网页内容高度和宽度：
var w=document.documentElement.scrollWidth || document.body.scrollWidth;
var h=document.documentElement.scrollHeight || document.body.scrollHeight;
3、JS获取网页内容的宽度高度（包括滚动条等边线，会随窗口的显示大小改变）
offsetWidth=clientWidth+滚动条+边框
var w= document.documentElement.offsetWidth || document.body.offsetWidth;
var h= document.documentElement.offsetHeight || document.body.offsetHeight;

查看全部

0 采集收起来源：网页尺寸offsetHeight
2019-05-01
深呼吸_0
访问子节点的第一和最后项
一、firstChild 属性返回‘childNodes’数组的第一个子节点。如果选定的节点没有子节点，则该属性返回 NULL。
语法：
```
node.firstChild
```
说明：与elementNode.childNodes[0]是同样的效果。
二、 lastChild 属性返回‘childNodes’数组的最后一个子节点。如果选定的节点没有子节点，则该属性返回 NULL。
语法：
```
node.lastChild
```
说明：与elementNode.childNodes[elementNode.childNodes.length-1]是同样的效果。
查看全部

0 采集收起来源：访问子节点的第一和最后项
2019-05-01
深呼吸_0

《平凡的一天》五一劳动节快乐！

查看全部

0 采集收起来源：访问子节点的第一和最后项
2019-05-01
你是漂亮的天蓝色

JS实现子节点的替换，返回被替换对象的引用：
replaceChild(newnode,oldnode);
如：
<div><b id="oldnode">JavaScript</b>技术</div>
<a href="javascript:replaceMessage()"> 将加粗改为斜体</a>
<script type="text/javascript">
function replaceMessage(){
var newnode=document.createElement("i");
var old=document.getElementById("oldnode");
var test=document.createTextNode(old.innerHTML);
newnode.appendChild(test);
old.parentNode.replaceChild(newnode,old);
}
</script>
解释：
1、var node=createElement("i");是创建一个元素节点<i>，但是里面没有内容，
2、需要通过var textnode=createTextNode(old.innerHTML);创建一个文本节点插入元素节点里面，赋给元素节点一些文本内容（即old节点的内容）
3、最后通过node.appendChild(textnode);将文本节点插入到元素节点后面

查看全部

0 采集收起来源：替换元素节点replaceChild()
2019-05-01
你是漂亮的天蓝色

JS从子节点列表中删除某个节点，若删除成功，可返回被删除的节点，若失败，则返回NULL
removeChile(node);
如：
<script>
var otest=document.getElementBuId("test");
var node=otest.childNodes[1];
var x=otest.removeChild(node);
document.write("删除的节点的内容："+x.innerHTML);
</script>
<div id="test">
<h1>HTML</h1>
<h1>javascript</h1>
</div>
运行结果：
HTML
删除的节点的内容：javascript
其中：把删除的子节点赋值给x，这个子节点不再DOM树中，但是还存在内存中，可通过x操作
要想完全删除对象，给x赋值null
var otest=document.getElementBuId("test");
var node=otest.childNodes[1];
var x=otest.removeChild(node);
x=null；

查看全部

0 采集收起来源：删除节点removeChild()
2019-05-01
你是漂亮的天蓝色
JS在已有的子节点前插入一个新的子节点：
insertBefore(newnode,node);
如:
<script>
var otest=document.getElementById("test");
var newnode=document.createElement("li");
newnode.innerHTML="php";
otest.insertBefore(newnode,otest.childNodes[0]);
</script>
<ul id="test">
<li>JavaScript</li>
<li>HTML</li>
</ul>
运行结果：
- JavaScript
- php
- HTML
查看全部

0 采集收起来源：插入节点insertBefore()
2019-05-01
深呼吸_0
在线web编程网站：
1. http://www.fenby.com/
2. jisuanke.com//数据结构比较好。
3. w3school.com.cn
4. shiyanlou.com
5. codecademy.com
查看全部

1 采集收起来源：访问子节点childNodes
2019-05-01
你是漂亮的天蓝色
JS在指定节点的最后一个子节点列表之后添加一个新的子节点：
appendChild(newnode);
<script>
var otest=document.getElementById("test");
var node=document.createElement("li');
node.innerHTML="PHP";
otest.append(node);
</script>
<ul>
<li>JavaScript</li>
<li>HTML</li>
</ul>

结果：
- JavaScript
- HTML
- PHP
查看全部

0 采集收起来源：插入节点appendChild()
2019-05-01
深呼吸_0

节点属性
在文档对象模型 (DOM) 中，每个节点都是一个对象。DOM 节点有三个重要的属性：
1. nodeName : 节点的名称
2. nodeValue ：节点的值
3. nodeType ：节点的类型
一、nodeName 属性: 节点的名称，是只读的。
1. 元素节点的 nodeName 与标签名相同
2. 属性节点的 nodeName 是属性的名称
3. 文本节点的 nodeName 永远是 #text
4. 文档节点的 nodeName 永远是 #document
二、nodeValue 属性：节点的值
1. 元素节点的 nodeValue 是 undefined 或 null
2. 文本节点的 nodeValue 是文本自身
3. 属性节点的 nodeValue 是属性的值
三、nodeType 属性: 节点的类型，是只读的。以下常用的几种结点类型:
元素类型节点类型
元素 1
属性 2
文本 3
注释 8
文档 9

查看全部

0 采集收起来源：节点属性
2019-05-01
深呼吸_0

区别getElementByID,getElementsByName,getElementsByTagName

查看全部

0 采集收起来源：区别getElementByID,getElementsByName,getElementsByTagName
2019-05-01
深呼吸_0

“人生的奋斗目标不要太大，认准了一件事情，投入兴趣与热情坚持去做，你就会成功”俞敏洪
“不是每一次努力都会有收获，但是，每一次收获都必须努力，这是一个不公平的不可逆转的命题。”于丹

查看全部

0 采集收起来源：认识DOM
2019-05-01
IT老戴

更多编程入门教程资源推荐梦帮客教程网（www.dreambangke.com），分享给想学习编程开发的同学。

查看全部

0 采集收起来源：让你认识JS
2019-05-01
要好好学习啊
```
function add2(x,y)
{
   sum = x + y;   return sum; //返回函数值,return后面的值叫做返回值。}
```
还可以通过变量存储调用函数的返回值，代码如下:
```
result = add2(3,4);//语句执行后,result变量中的值为7。
```
注意:函数中参数和返回值不只是数字，还可以是字符串等其它类型。
查看全部

0 采集收起来源：返回值的函数
2019-05-01

要好好学习啊

函数定义好后，是不能自动执行的，需要调用它,直接在需要的位置写函数名。

第一种情况:在<script>标签内调用。

  <script type="text/javascript">
    function add2()
    {
         sum = 1 + 1;
         alert(sum);
    }  add2();//调用函数，直接写函数名。</SCRIPT>

第二种情况:在HTML文件中调用，如通过点击按钮后调用定义好的函数。

<html>
<head><script type="text/javascript">
   function add2()
   {
         sum = 5 + 6;
         alert(sum);
   }
</script>
</head>
<body>
<form>
<input type="button" value="click it" onclick="add2()">  //按钮,onclick点击事件，直接写函数名</form>
</body>
</html>

注意:鼠标事件会在后面讲解。

查看全部

0 采集收起来源：函数调用

2019-05-01

要好好学习啊

使用函数完成:

function add2(a,b){
sum = a + b;
 alert(sum);
} //  只需写一次就可以add2(3,2);
add2(7,8);
....  //只需调用函数就可以

查看全部

0 采集收起来源：什么是函数

2019-05-01

首页上一页 390 391 392 393 394 395 396 下一页尾页

0/150

提交

取消

开始学习

课程须知: 你需要具备HTML、css基础知识，建议同学们也可以想学习下js入门篇，快速认识js，熟悉js基本语法，更加快速入手进阶篇！

老师告诉你能学到什么？: 通过JavaScript学习，掌握基本语法，制作简单交互式页面

JavaScript进阶篇

访问子节点的第一和最后项

节点属性

区别getElementByID,getElementsByName,getElementsByTagName