慕课网

精品课程 JavaScript进阶篇

JavaScript进阶篇

最热最新

o0南柯一梦

不容易啊

查看全部

0 采集收起来源：编程练习
2015-04-13
MushishiXian

编辑器<script>标签中，创建一个P标签，设置className属性，使用createTextNode创建文本节点"I love JavaScript!"。 <script type="text/javascript"> var newp=document.createElement("p"); newp.className="message"; newp.appendChild(document.createTextNode("I love javascript")); document.body.appendChild(newp); </script>

查看全部

0 采集收起来源：创建文本节点createTextNode
2018-03-22
MushishiXian

注意：要与appendChild() 或 insertBefore()方法联合使用，将元素显示在页面中。我们来创建一个按钮，代码如下： <script type="text/javascript"> var body = document.body; var input = document.createElement("input"); input.type = "button"; input.value = "创建一个按钮"; body.appendChild(input); </script> 效果：在HTML文档中，创建一个按钮

查看全部

0 采集收起来源：创建元素节点createElement
2018-03-22
MushishiXian

补充函数 replaceMessage() 代码，实现将 b 标签替换成 i 标签。 <body> <div><b id="oldnode">JavaScript</b>是一个很常用的技术，为网页添加动态效果。</div> <a href="javascript:replaceMessage()"> 将加粗改为斜体</a> <script type="text/javascript"> function replaceMessage(){ var oldnode=document.getElementById("oldnode"); var newnode=document.createElement("i"); newnode.innerHTML=oldnode.innerHTML oldnode.parentNode.replaceChild(newnode,oldnode); } </script> </body>

查看全部

0 采集收起来源：替换元素节点replaceChild()
2018-03-22
MushishiXian

1. 删除该节点的内容，先要获取子节点。 2. 然后使用循环遍历每个子节点。 3. 使用removeChild()删除节点。 <body> <div id="content"> <h1>html</h1> <h1>php</h1> <h1>javascript</h1> <h1>jquery</h1> <h1>java</h1> </div> <script type="text/javascript"> function clearText() { var content=document.getElementById("content"); // 在此完成该函数 for(var i=content.childNodes.length-1;i>=0;i--){ var chnode=content.childNodes[i]; content.removeChild(chnode); } } </script> <button onclick="clearText()">清除节点内容</button> </body>

查看全部

0 采集收起来源：删除节点removeChild()
2018-03-22
MushishiXian

在script 标签内补充代码，实现创建一个新li标签，内容为"php",并将新创建的li插入到内容为HTML的标签前。 <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"); newnode.innerHTML="PHP"; otest.insertBefore(newnode, otest.childNodes[1]); </script> </body>

查看全部

0 采集收起来源：插入节点insertBefore()
2018-03-22
MushishiXian

1.在代码编辑器中，script标签内，为ul添加一个li。 2.设置li内容为PHP。 <script type="text/javascript"> var otest = document.getElementById("test"); var newnode=document.createElement("li"); newnode.innerHTML="PHP"; otest.appendChild(newnode); </script>

查看全部

0 采集收起来源：插入节点appendChild()
2018-03-22
MushishiXian

访问兄弟节点 1. nextSibling 属性可返回某个节点之后紧跟的节点（处于同一树层级中）。语法： nodeObject.nextSibling 说明：如果无此节点，则该属性返回 null。 2. previousSibling 属性可返回某个节点之前紧跟的节点（处于同一树层级中）。语法： nodeObject.previousSibling 说明：如果无此节点，则该属性返回 null。

查看全部

0 采集收起来源：访问兄弟节点
2015-04-13
MushishiXian

访问兄弟节点 1. nextSibling 属性可返回某个节点之后紧跟的节点（处于同一树层级中）。语法： nodeObject.nextSibling 说明：如果无此节点，则该属性返回 null。 2. previousSibling 属性可返回某个节点之前紧跟的节点（处于同一树层级中）。语法： nodeObject.previousSibling 说明：如果无此节点，则该属性返回 null。

查看全部

0 采集收起来源：访问兄弟节点
2015-04-13
MushishiXian

试一试，找到指定元素(div)的第一个和最后一个子节点。 1. 第15行输出指定元素(div)的第一个子节点。 2. 第16行输出指定元素(div)的最后一个子节点。 <div id="con"><p>javascript</p><div>jQuery</div><h5>PHP</h5></div> <script type="text/javascript"> var x=document.getElementById("con"); document.write(x.firstChild.nodeName); document.write(x.lastChild.nodeName); </script>

查看全部

0 采集收起来源：访问子节点的第一和最后项
2018-03-22
MushishiXian

1. 获取第一个DIV的子节点。 2. 使用for遍历每个节点。 3. 输出相应节点的属性。 <body> <div> javascript <p>javascript</p> <div>jQuery</div> <h5>PHP</h5> </div> <script type="text/javascript"> var node=document.getElementsByTagName("div")[0].childNodes; for(var i=0;i<node.length;i++) { document.write("[第"+(i+1)+"个节点]"+"<br/>"+"节点名："+node[i].nodeName+"<br/>"+"节点类型："+node[i].nodeType+"<br/>"+"节点值："+node.nodeValue+"<br/>"+"<br/>") } </script> </body>

查看全部

0 采集收起来源：访问子节点childNodes
2018-03-22
IceKing

................

查看全部

0 采集收起来源：选定元素slice()
2015-04-13
MushishiXian

使用getAttribute()方法获取元素属性值，保存在变量text。使用setAttribute()方法设置title属性值。 <body> <p id="intro">我的课程</p> <ul> <li title="JS">JavaScript</li> <li title="JQ">JQuery</li> <li title="">HTML/CSS</li> <li title="JAVA">JAVA</li> <li title="">PHP</li> </ul> <h1>以下为li列表title的值,当title为空时，新设置值为"WEB前端技术":</h1> <script type="text/javascript"> var Lists=document.getElementsByTagName("li"); for (var i=0; i<Lists.length;i++) { var text=Lists[i].getAttribute("title"); document.write(text +"<br>"); if(text=="") { Lists[i].setAttribute("title","WEB前端技术"); document.write(Lists[i].getAttribute("title")+"<br>"); } } </script> </body>

查看全部

0 采集收起来源：setAttribute()方法
2018-03-22
MushishiXian

使用getAttribute()方法，获取LI标签的title值。 <body> <p id="intro">课程列表</p> <ul> <li title="第1个li">HTML</li> <li>CSS</li> <li title="第3个li">JavaScript</li> <li title="第4个li">Jquery</li> <li>Html5</li> </ul> <p>以下为获取的不为空的li标签title值:</p> <script type="text/javascript"> var con=document.getElementsByTagName("li"); for (var i=0; i< con.length;i++){ var text=con[i].getAttribute("title"); if(text!=null) { document.write(text+"<br>"); } } </script> </body> 以下为获取的不为空的li标签title值: 第1个li 第3个li 第4个li

查看全部

0 采集收起来源：getAttribute()方法
2018-03-22
MushishiXian

全选全不选 function checkall(){ var hobby = document.getElementsByTagName("input"); for(var i=0;i<hobby.length;i++){ hobby[i].checked=true; } // 任务1 } function clearall(){ var hobby = document.getElementsByName("hobby"); //alert(hobby.length); for(var i=0;i<hobby.length;i++){ hobby[i].checked=false; }

查看全部

0 采集收起来源：区别getElementByID,getElementsByName,getElementsByTagName
2018-03-22

首页上一页 7219 7220 7221 7222 7223 7224 7225 下一页尾页

0/150

提交

取消

开始学习

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

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