吴裕雄--天生自然 JAVASCRIPT开发学习:HTML DOM 节点列表
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body> <h2>JavaScript HTML DOM!</h2> <p>Hello World!</p> <p>Hello Runoob!</p> <p id="demo"></p> <script>
var myNodelist = document.querySelectorAll("p");
document.getElementById("demo").innerHTML = "第二个段落的内容为:<span style='color:red;'> " + myNodelist[1].innerHTML + '</span>';
</script> </body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body> <h2>JavaScript HTML DOM!</h2> <p>Hello World!</p> <p>Hello Runoob!</p> <p id="demo"></p> <script>
var myNodelist = document.querySelectorAll("p");
document.getElementById("demo").innerHTML = "文档包含 " + myNodelist.length + " 个段落。";
</script> </body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body> <h2>JavaScript HTML DOM!</h2> <p>Hello World!</p> <p>Hello Runoob!</p> <p>点击按钮修改所有 p 元素的背景颜色。</p> <button onclick="myFunction()">点我</button> <script>
function myFunction() {
var myNodelist = document.querySelectorAll("p");
var i;
for (i = 0; i < myNodelist.length; i++) {
myNodelist[i].style.color = "red";
}
}
</script> </body>
</html>

吴裕雄--天生自然 JAVASCRIPT开发学习:HTML DOM 节点列表的更多相关文章
- 吴裕雄--天生自然 JAVASCRIPT开发学习:DOM EventListener
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄--天生自然 JAVASCRIPT开发学习: DOM 事件
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄--天生自然 JAVASCRIPT开发学习: DOM - 改变 HTML
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄--天生自然 JAVASCRIPT开发学习: DOM
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄--天生自然 JAVASCRIPT开发学习:对象 实例(2)
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄--天生自然 JAVASCRIPT开发学习:条件语句
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄--天生自然 JAVASCRIPT开发学习:对象
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄--天生自然 JAVASCRIPT开发学习
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄--天生自然 JAVASCRIPT开发学习:函数定义
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- 吴裕雄--天生自然 JAVASCRIPT开发学习: this 关键字
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
随机推荐
- Webstorm常用快捷键备忘
WebStorm 是jetbrains公司旗下一款JavaScript 开发工具.被广大中国JS开发者誉为“Web前端开发神器”.“最强大的HTML5编辑器”.“最智能的JavaSscript IDE ...
- 吴裕雄--天生自然java开发常用类库学习笔记:Stack类
import java.util.Stack ; public class StackDemo{ public static void main(String args[]){ Stack<St ...
- 完整版excel上传导入读写批量数据并将反馈结果写入远程exel中
思路:excel的读写借助于poi框架,在写入远程的时候,是不能直接写入的,本博主将传入的文件再次拉下来写到项目临时文件中,然后,在临时文件中写入,然后,以同样的名称路径覆盖掉远程的就可以了,稍微有点 ...
- nodejs 杂七杂八
nodejs => 提供核心模块语法 node中的回调函数 都是异步
- MongoDB 常用查询语法
一.查询 find方法 db.collection_name.find(); 查询所有的结果: select * from users; db.users.find(); 指定返回那些列(键): se ...
- windows炸鸡啤酒
20170831 今天郁闷,一台windwos远处不上去,被怼了,只能说我活该,事先不弄清楚自己负责的服务运行机器的管理员. 今天尤其特别想知道这台windows跑了多久(linux:uptime), ...
- 最小生成树(Kruskal+Prim)--模板
最小生成树-----在连通网的所有生成树中,所有边的代价和最小的生成树,称为最小生成树. 应用场景 1.假设以下情景,有一块木板,板上钉上了一些钉子,这些钉子可以由一些细绳连接起来.假设每个钉子可以通 ...
- 第二篇MTV模型、基本命令、简单配置
MTV模型.基本命令.简单配置 阅读目录(Content) MTV模型 基本命令 简单配置 MTV模型 Django的MTV分别代表: Model(模型):负责业务对象与数据库的对象(ORM) Tem ...
- 个人vim简单配置
精简.vimrc配置,简约不简单 该配置没有花里胡哨的插件,只是用ctags和cscope然后配合vim提供的基础功能就可以完成常见的代码编辑,浏览,查找等工作. "************ ...
- 使用模拟器调试react-native步骤(安卓机)
1.在cmd界面搭建react-native 环境: 可参考https://reactnative.cn/docs/0.51/getting-started.html#content (1)npm i ...