其实HTML就是类似于XML,曾经W3C希望使用XML替代HTML,这就是说明,HTML和XML还是有一定的共同特点的,所以说,对于XML,我们有解析和动态增加或者减少节点的功能,这个如果用在HTML上面,那就是能动态的增加一些按钮,超链接等等的HTML元素,这样的网页动态效果会更好,下面我们来一个小例子说明一下,这个例子能动态的增加一些按钮和动态的删除一些按钮.代码如下
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>test9.html</title> <script type="text/javascript"> function test(){ //创建元素 var myElement = document.createElement("input");//输入想要创建的类型 myElement.type="button"; myElement.value="我是按钮"; myElement.id="id1"; //将元素添加到指定的节点 document.getElementById("p1").appendChild(myElement); // document.body.appendChild(myElement); } function test1(){ //删除一个元素 // document.getElementById("p1").removeChild(document.getElementById("id1")); //第二种方式灵活 document.getElementById("id1").parentNode.removeChild(document.getElementById("id1")); } </script> </head> <body> <input type="button" onclick="test();" value="动态的创建一个按钮"><br/> <input type="button" onclick="test1();" value="删除按钮"/> <p id="p1" style="width:200px;height: 400px;border: 1px solid red;"> </p> </body> </html>
这里就使用document 的大部分方法进行增加和删除节点的作用,呵呵,其实document是一个功能非常强大的Dom 对象。
下面再写一个对于document的 name的迭代方法,处理对于复选框如何获取所有的选项并且打印出来的
代码如下
<!sDOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>test8.html</title> <script type="text/javascript"> function test(){ var hobbys = document.getElementsByName("hobby"); for(var i =0; i < hobbys.length; i++){ //判断是否被选择 if(hobbys[i].checked){ window.alert("您的爱好是"+hobbys[i].value); } } } </script> </head> <body> 请选择你的爱好: <input type="checkbox" name="hobby" value="足球"/>足球<br/> <input type="checkbox" name="hobby" value="篮球"/>篮球<br/> <input type="checkbox" name="hobby" value="旅游"/>旅游<br/> <input type="button" value="测试" onclick="test();"> </body> </html>
更多相关教程请访问 JavaScript视频教程

去掉重复并排序的方法:1、使用“Array.from(new Set(arr))”或者“[…new Set(arr)]”语句,去掉数组中的重复元素,返回去重后的新数组;2、利用sort()对去重数组进行排序,语法“去重数组.sort()”。

本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于Symbol类型、隐藏属性及全局注册表的相关问题,包括了Symbol类型的描述、Symbol不会隐式转字符串等问题,下面一起来看一下,希望对大家有帮助。

怎么制作文字轮播与图片轮播?大家第一想到的是不是利用js,其实利用纯CSS也能实现文字轮播与图片轮播,下面来看看实现方法,希望对大家有所帮助!

本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于对象的构造函数和new操作符,构造函数是所有对象的成员方法中,最早被调用的那个,下面一起来看一下吧,希望对大家有帮助。

本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于面向对象的相关问题,包括了属性描述符、数据描述符、存取描述符等等内容,下面一起来看一下,希望对大家有帮助。

方法:1、利用“点击元素对象.unbind("click");”方法,该方法可以移除被选元素的事件处理程序;2、利用“点击元素对象.off("click");”方法,该方法可以移除通过on()方法添加的事件处理程序。

本篇文章给大家带来了关于JavaScript的相关知识,其中主要介绍了关于BOM操作的相关问题,包括了window对象的常见事件、JavaScript执行机制等等相关内容,下面一起来看一下,希望对大家有帮助。

foreach不是es6的方法。foreach是es3中一个遍历数组的方法,可以调用数组的每个元素,并将元素传给回调函数进行处理,语法“array.forEach(function(当前元素,索引,数组){...})”;该方法不处理空数组。


熱AI工具

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool
免費脫衣圖片

Clothoff.io
AI脫衣器

AI Hentai Generator
免費產生 AI 無盡。

熱門文章

熱工具

MantisBT
Mantis是一個易於部署的基於Web的缺陷追蹤工具,用於幫助產品缺陷追蹤。它需要PHP、MySQL和一個Web伺服器。請查看我們的演示和託管服務。

VSCode Windows 64位元 下載
微軟推出的免費、功能強大的一款IDE編輯器

Dreamweaver Mac版
視覺化網頁開發工具

SublimeText3 英文版
推薦:為Win版本,支援程式碼提示!

記事本++7.3.1
好用且免費的程式碼編輯器