慕课网

精品课程 JavaScript进阶篇

JavaScript进阶篇

最热最新

慕斯卡7430691
删除节点removeChild()
removeChild() 方法从子节点列表中删除某个节点。如删除成功，此方法可返回被删除的节点，如失败，则返回 NULL。
语法:
```
nodeObject.removeChild(node)
```
参数:
node ：必需，指定需要删除的节点。
我们来看看下面代码，删除子点。
运行结果:
```
HTML 删除节点的内容: javascript
```
注意: 把删除的子节点赋值给 x，这个子节点不在DOM树中，但是还存在内存中，可通过 x 操作。
如果要完全删除对象，给 x 赋 null 值，代码如下:

任务
试一试，定义clearText()函数，完成节点内容的删除。
1. 删除该节点的内容，先要获取子节点。
2. 然后使用循环遍历每个子节点。
3. 使用removeChild()删除节点。
查看全部

0 采集收起来源：删除节点removeChild()
2019-01-09
慕粉4365226

这个地方有错误，分割.的方式是“\\.”

查看全部

0 采集收起来源：字符串分割split()
2019-01-09
莫问归途何往
创建一个新的文本节点.
语法:
```
var text = document.createTextNode(data);
```
- text 是一个文本节点.
- data 是一个字符串,包含了放在文本节点中的内容.
document.createTextNode
查看全部

0 采集收起来源：创建文本节点createTextNode
2019-01-08
慕函数7452445

window.onunload = onunload_message;
function onunload_message(){
alert("您确定离开该网页吗？");
}

查看全部

0 采集收起来源：卸载事件（onunload）
2019-01-08
慕函数7452445

当用户退出页面时（页面关闭、页面刷新等），触发onUnload事件，同时执行被调用的程序。
注意：不同浏览器对onunload事件支持不同。
不同浏览器有哪些不同？

查看全部

0 采集收起来源：卸载事件（onunload）
2019-01-08
莫问归途何往
在一个 HTML 文档中， Document.createElement() 方法创建由tagName 指定的HTML元素，或一个HTMLUnknownElement，如果tagName不被识别。
在一个 XUL 文档中，它创建指定的XUL元素。在其他文档中，它创建一个具有null命名空间URI的元素。
要显式指定元素的命名空间URI，请使用 document.createElementNS()
```
let element=document.createElement(tagName[, options]);
```
- tagName
- 指定要创建元素类型的字符串,创建元素时的nodeName使用tagName的值为初始化,该方法不接受使用限定名称(如:"html:a"),在HTML文档上调用createElement()方法创建元素之前会将tagName转化成小写,在Firefox, Opera 和 Chrome内核中. createElement(null) 等同于 createElement("null")
- options可选
- 一个可选的参数 ElementCreationOptions 是包含一个属性名为 is的对象, 该对象的值是用 customElements.define()方法定义过的一个自定义元素的标签名。为了向前兼容较老版本的 Custom Elements specification, 有一些浏览器会允许你传一个值为自定义元素的标签名的字符串作为该参数的值. 可以看 Extending native HTML elements 仔细了解如何使用该参数。
- 这个新元素会有一个 is 属性，该属性值为自定义元素的标签名。注意，自定义元素是一项只在某些浏览器可用的实验性特性。
Document.createElement()
查看全部

0 采集收起来源：创建元素节点createElement
2019-01-08
莫问归途何往
用指定的节点替换当前节点的一个子节点，并返回被替换掉的节点。
```
replacedNode = parentNode.replaceChild(newChild, oldChild);
```
- newChild 用来替换 oldChild 的新节点。如果该节点已经存在于DOM树中，则它会被从原始位置删除。
- oldChild 被替换掉的原始节点。
- replacedNode 和oldChild相等。
Node.replaceChild
查看全部

0 采集收起来源：替换元素节点replaceChild()
2019-01-08
莫问归途何往
Node.removeChild() 方法从DOM中删除一个子节点。返回删除的节点。
语法:
```
let oldChild = node.removeChild(child);//ORelement.removeChild(child);
```
- child 是要移除的那个子节点.
- node 是child的父节点.
- oldChild保存对删除的子节点的引用. oldChild === child.
被移除的这个子节点仍然存在于内存中,只是没有添加到当前文档的DOM树中,因此,你还可以把这个节点重新添加回文档中,当然,实现要用另外一个变量比如上例中的oldChild来保存这个节点的引用. 如果使用上述语法中的第二种方法, 即没有使用 oldChild 来保存对这个节点的引用, 则认为被移除的节点已经是无用的, 在短时间内将会被内存管理回收.
如果上例中的child节点不是node节点的子节点,则该方法会抛出异常.
Node.removeChild
查看全部

0 采集收起来源：删除节点removeChild()
2019-01-08
FreudLi
createTextNode() 方法创建新的文本节点，返回新创建的 Text 节点。
语法：
```
document.createTextNode(data)
```
参数：
data : 字符串值，可规定此节点的文本。
查看全部

0 采集收起来源：创建文本节点createTextNode
2019-01-08
前端菜鸟1

制作一个表格，显示班级的学生信息。
要求：
1. 鼠标移到不同行上时背景色改为色值为 #f2f2f2，移开鼠标时则恢复为原背景色 #fff
2. 点击添加按钮，能动态在最后添加一行
3. 点击删除按钮，则删除当前行
<!DOCTYPE html>
<html>
<head>
<title> new document </title>
<meta http-equiv="Content-Type" content="text/html; charset=gbk"/>
<script type="text/javascript">
window.onload = function(){
var tr=document.getElementsByTagName("tr");
for(var i= 1;i<tr.length;i++)
{
bgcChange(tr[i]);
}
// 鼠标移动改变背景,可以通过给每行绑定鼠标移上事件和鼠标移除事件来改变所在行背景色。
}
function bgcChange(obj)
{
obj.onmouseover=function(){
obj.style.backgroundColor="gray";
}
obj.onmouseout=function(){
obj.style.backgroundColor="cyan";
}
}

// 编写一个函数，供添加按钮调用，动态在表格的最后一行添加子节点；
function add(){
var tab=document.getElementById("table");
var tr=document.createElement("tr");
var xh=document.createElement("td");
var xm=document.createElement("td");
var del=document.createElement("td");
del.innerHTML="<a href='javascript:;' onclick='del(this)' >删除</a>";
tab.appendChild(tr);
tr.appendChild(xh);
tr.appendChild(xm);
tr.appendChild(del);
var trs = document.getElementsByTagName("tr");
for(var i= 1;i<trs.length;i++)
{
xh.innerHTML="xh00"+i;
xm.innerHTML="第"+i+"学生";
bgcChange(trs[i]);
}
}

// 创建删除函数
function del(obj)
{
var tr=obj.parentNode.parentNode;
tr.parentNode.removeChild(tr);
}
</script>
</head>
<body>
<table border="1" width="50%" id="table">
<tr>
<th>学号</th>
<th>姓名</th>
<th>操作</th>
</tr>

<tr>
<td>xh001</td>
<td>王小明</td>
<td><a href="javascript:;" onclick="del()">删除</a></td> 
</tr>

<tr>
<td>xh002</td>
<td>刘小芳</td>
<td><a href="javascript:;" onclick="del()">删除</a></td> 
</tr>

</table>
<input type="button" value="添加一行" onclick="add()"/> 
</body>
</html>

查看全部

0 采集收起来源：编程练习
2019-01-08
FreudLi
createElement()方法可创建元素节点。此方法可返回一个 Element 对象。
语法：
```
document.createElement(tagName)
```
参数:
tagName：字符串值，这个字符串用来指明创建元素的类型。
注意：要与appendChild() 或 insertBefore()方法联合使用，将元素显示在页面中。
查看全部

0 采集收起来源：创建元素节点createElement
2019-01-08
前端菜鸟1

scrollLeft:设置或获取位于给定对象左边界与窗口中目前可见内容的最左端之间的距离，即左边灰色的内容。
scrollTop:设置或获取位于对象最顶端与窗口中可见内容的最顶端之间的距离，即上边灰色的内容。
offsetLeft:获取指定对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置。
offsetTop:获取指定对象相对于版面或由 offsetParent 属性指定的父坐标的计算顶端位置。

查看全部

0 采集收起来源：网页卷去的距离与偏移量
2019-01-08
前端菜鸟1

访问兄弟节点的前一个节点和后一个节点！

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>nextSibling</title>
</head>
<body>
<ul id="u1">
<li id="a">javascript</li>
<li id="b">jquery</li>
<li id="c">html</li>
</ul>
<ul id="u2">
<li id="d">css3</li>
<li id="e">php</li>
<li id="f">java</li>
</ul>
<script type="text/javascript">
function get_nextSibling(n){
var x=n.nextSibling;
while (x && x.nodeType!=1){
x=x.nextSibling;
}
return x;
}
function get_previsSibling(n){
var x=n.previousSibling;
while (x && x.nodeType!=1){
x=x.previousSibling;
}
return x;
}
var x=document.getElementsByTagName("li")[4];
document.write(x.nodeName);
document.write(" = ");
document.write(x.innerHTML);

var y=get_nextSibling(x);
var m=get_previsSibling(x);

if(y!=null){
document.write("<br />nextsibling: ");
document.write(y.nodeName);
document.write(" = ");
document.write(y.innerHTML);
}else{
document.write("<br>已经是最后一个节点");
}

if(m!=null){
document.write("<br />previssibling: ");
document.write(m.nodeName);
document.write(" = ");
document.write(m.innerHTML);
}else{
document.write("<br>已经是第一个节点");
}

</script>
</body>
</html>

查看全部

0 采集收起来源：访问兄弟节点
2019-01-08
慕函数7452445
1. 二维数组的定义方法一
```
var myarr=new Array();  //先声明一维 
for(var i=0;i<2;i++){   //一维长度为2
   myarr[i]=new Array();  //再声明二维 
   for(var j=0;j<3;j++){   //二维长度为3
   myarr[i][j]=i+j;   // 赋值，每个数组元素的值为i+j
   }
 }
```
2. 二维数组的定义方法二
var Myarr = [[0 , 1 , 2 ],[1 , 2 , 3]]
3. 赋值
myarr[0][1]=5; //将5的值传入到数组中，覆盖原有值。
说明: myarr[0][1] ,0 表示表的行，1表示表的列。
查看全部

0 采集收起来源：二维数组
2019-01-08
莫问归途何往
语法:
```
var insertedNode = parentNode.insertBefore(newNode, referenceNode);
```
- insertedNode The node being inserted, that is newNode
- parentNode The parent of the newly inserted node.
- newNode The node to be inserted.
- referenceNode The node before which newNode is inserted.
如果referenceElement为null则newElement将被插入到子节点的末尾。如果newElement已经在DOM树中，newElement首先会从DOM树中移除。
return value
The returned value is the added child except when newNode is a DocumentFragment, in which case the empty DocumentFragment is returned.
Node.insertBefore()
查看全部

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

首页上一页 479 480 481 482 483 484 485 下一页尾页

0/150

提交

取消

开始学习

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

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

JavaScript进阶篇

删除节点removeChild()

任务