慕课网

精品课程 JavaScript进阶篇

JavaScript进阶篇

最热最新

PaulPierce

移除,会影响的影响对象数组的下标.
空节点也能移动, 也会影响对象数组的下标
因此最好从数组后面移除.
就算空白节点里面添加文字, 也是没法用innerHTML来输出.

查看全部

0 采集收起来源：删除节点removeChild()
2019-01-03
慕斯卡7430691
屏幕可用高和宽度
1. screen.availWidth 属性返回访问者屏幕的宽度，以像素计，减去界面特性，比如任务栏。
2. screen.availHeight 属性返回访问者屏幕的高度，以像素计，减去界面特性，比如任务栏。
注意:
不同系统的任务栏默认高度不一样，及任务栏的位置可在屏幕上下左右任何位置，所以有可能可用宽度和高度不一样。

我们来获取屏幕的可用高和宽度，代码如下：
```
<script type="text/javascript"> document.write("可用宽度：" + screen.availWidth); document.write("可用高度：" + screen.availHeight); </script>
```
注意:根据屏幕的不同显示值不同。

任务
使用window.screen对象，完成下面任务,看看你的屏幕可用大小:
补充右边编辑器第9行，输出屏幕可用宽度
补充右边编辑器第10行，输出屏幕可用高度
注意: 大家可以把任务栏的位置和大小改变下，看看获取的值有什么区别。
查看全部

0 采集收起来源：屏幕可用高和宽度
2019-01-03
慕斯卡7430691
屏幕分辨率的高和宽
window.screen 对象包含有关用户屏幕的信息。
1. screen.height 返回屏幕分辨率的高
2. screen.width 返回屏幕分辨率的宽
注意:
1.单位以像素计。
2. window.screen 对象在编写时可以不使用 window 这个前缀。
我们来获取屏幕的高和宽，代码如下:
```
<script type="text/javascript">   document.write( "屏幕宽度："+screen.width+"px<br />" );   document.write( "屏幕高度："+screen.height+"px<br />" ); </script>
```
任务
使用window.screen对象，完成下面任务,看看你的屏幕大小:
补充右边编辑器第9行，输出屏幕宽度。
补充右边编辑器第10行，输出屏幕高度。
查看全部

0 采集收起来源：屏幕分辨率的高和宽
2019-01-03
慕斯卡7430691
userAgent
返回用户代理头的字符串表示(就是包括浏览器版本信息等的字符串)
语法
```
navigator.userAgent
```
几种浏览的user_agent.，像360的兼容模式用的是IE、极速模式用的是chrom的内核。
使用userAgent判断使用的是什么浏览器(假设使用的是IE8浏览器),代码如下:
```
function validB(){    var u_agent = navigator.userAgent;    var B_name="Failed to identify the browser";    if(u_agent.indexOf("Firefox")>-1){        B_name="Firefox";    }else if(u_agent.indexOf("Chrome")>-1){        B_name="Chrome";    }else if(u_agent.indexOf("MSIE")>-1&&u_agent.indexOf("Trident")>-1){        B_name="IE(8-10)";     }     document.write("B_name:"+B_name+"<br>");     document.write("u_agent:"+u_agent+"<br>");  }
```
运行结果:

任务
补充右边编辑器第8行，使用userAgent获取浏览器信息，并保存在u_agent中。
补充右边编辑器第24行，点击"查看浏览器"按钮，显示浏览器和浏览器相关信息。
查看全部

0 采集收起来源：userAgent
2019-01-03
慕斯卡7430691
Navigator对象
Navigator 对象包含有关浏览器的信息，通常用于检测浏览器与操作系统的版本。
对象属性:
查看浏览器的名称和版本，代码如下:
```
<script type="text/javascript">    var browser=navigator.appName;    var b_version=navigator.appVersion;    document.write("Browser name"+browser);    document.write("<br>");    document.write("Browser version"+b_version); </script>
```
任务
在右边编辑器script标签内，使用Navigator对象，查看浏览器相关信息。
查看全部

0 采集收起来源：Navigator对象
2019-01-03
鬼谷子007

网页尺寸offsetHeight
offsetHeight和offsetWidth，获取网页内容高度和宽度(包括滚动条等边线，会随窗口的显示大小改变)。
一、值
offsetHeight = clientHeight + 滚动条 + 边框。

查看全部

0 采集收起来源：网页尺寸offsetHeight
2019-01-03
鬼谷子007

1. 元素节点的 nodeValue 是 undefined 或 null
2. 文本节点的 nodeValue 是文本自身
3. 属性节点的 nodeValue 是属性的值

查看全部

0 采集收起来源：节点属性
2019-01-03
鬼谷子007

一、语法： node.firstChild 说明：与elementNode.childNodes[0]是同样的效果。二、语法： node.lastChild 说明：elementNode.childNodes[elementNode.childNodes.length-1]是同样的效果。

查看全部

0 采集收起来源：访问子节点的第一和最后项
2019-01-03
鬼谷子007
语法：
```
elementNode.parentNode
```
注意:父节点只能有一个。
节点名称nodeName或节点值nodeValue或节点类型nodeType
```
document.write(mynode.parentNode.nodeName);
```
查看全部

0 采集收起来源：访问父节点parentNode
2019-01-03
慕设计2413265

未能完全完成

查看全部

0 采集收起来源：删除节点removeChild()
2019-01-03
慕斯卡7430691
go()方法，根据当前所处的页面，加载 history 列表中的某个具体的页面。
语法：
```
window.history.go(number);
```
参数：
浏览器中，返回当前页面之前浏览过的第二个历史页面，代码如下：
```
window.history.go(-2);
```
注意：和在浏览器中单击两次后退按钮操作一样。
同理，返回当前页面之后浏览过的第三个历史页面，代码如下：
```
window.history.go(3);
```
任务
补充右边代码编辑器第9行和第13行,使用go()方法，完善GoBack()和GoForward()函数，实现返回前或下一个页面功能。
注意:本编辑器有局限性，可以把代码拷贝到本机上练习，或者在本节页面窗口多打开几个网页后(为了添加历史列表项)，在打开本节进行练习。
查看全部

0 采集收起来源：返回浏览历史中的其他页面
2019-01-03
慕莱坞2198904

插入节点appendChild()
在指定节点的最后一个子节点列表之后添加一个新的子节点。

查看全部

0 采集收起来源：插入节点appendChild()
2019-01-03
wingle

二维数组的两个维度的索引值也是从0开始，两个维度的最后一个索引值为长度-1;这里写为索引值为：长度-1，要不会有歧义。

查看全部

0 采集收起来源：二维数组
2019-01-03
慕莱坞2198904

<body>
<ul id="test">
<li>JavaScript</li>
<li>HTML</li>
</ul>

<script type="text/javascript">
var otest = document.getElementById("test");
var newnode = document.createElement("li");
var newtext= document.createTextNode("PHP");
newnode.appendChild(newtext);
otest.appendChild(newnode);

</script>
</body>

查看全部

0 采集收起来源：插入节点appendChild()
2019-01-03
FreudLi

insertBefore() 方法可在已有的子节点前插入一个新的子节点。
语法:
insertBefore(newnode, node);
参数:
newnode: 要插入的新节点。
node: 指定此节点前插入节点。

用法: parentNode.insertBefore(newnode, node);
说明: 父节点.insertBefore(新子节点, 子节点);

查看全部

0 采集收起来源：插入节点insertBefore()
2019-01-03