访问 HTML 元素（节点）

访问 HTML 元素等同于访问节点

您能够以不同的方式来访问 HTML 元素：

  • 通过使用 getElementById() 方法
  • 通过使用 getElementsByTagName() 方法
  • 通过使用 getElementsByClassName() 方法
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

 <head>

  <title> New Document </title>

  <meta name="Generator" content="EditPlus">

  <meta name="Author" content="">

  <meta name="Keywords" content="">

  <meta name="Description" content="">

 </head>

 <body>

  <p id = "intro">Hello World!</p>

  <p>本例演示<b>getElementById("intro");</b></p>

  <script type="text/javascript">

 x  = document.getElementById("intro");

 document.write("<p>来自intro段落的文本："+x.innerHTML);

  </script>

 </body>

</html>

getElementsByTagName() 方法

getElementsByTagName() 返回带有指定标签名的所有元素。

<!DOCTYPE html>

<html>

<body>

<p>Hello World!</p>

<p>DOM 很有用！</p>

<p>本例演示 <b>getElementsByTagName</b> 方法。</p>

<script>

x=document.getElementsByTagName("p");

document.write("第一段的文本: " + x[0].innerHTML+"<br>");

document.write("第二段的文本: " + x[1].innerHTML+"<br>");

document.write("第三段的文本: " + x[2].innerHTML);

</script>

</body>

</html>

HTML DOM访问的更多相关文章

  1. DOM学习总结（三）DOM访问/操作

    DOM访问理解:找到这个标签元素,然后才能对它进行操作 1.getElementById() 方法document.getElementById(""); //通过id名字来找到 ...

  2. Javascript高性能编程-提高Dom访问速度

    在浏览器中对于Dom的操作和普通的脚本的操作处于两个不同的dll中,两个dll的交互是比较耗时的,优化对Dom的操作可以提高脚本的执行速度.下面是对如何优化的一些总结: 将需要多次操作的节点存储在一个 ...

  3. 提高Dom 访问效率

    在浏览器中对于Dom的操作和普通的脚本的操作处于两个不同的dll中,两个dll的交互是比较耗时的,优化对Dom的操作可以提高脚本的执行速度. JS访问DOM是很慢的,尽量不要用JS来设置页面 布局 有 ...

  4. DOM访问元素样式和操作元素样式

    在HTML中定义样式的方式有三种:通过<link/>元素包含外部样式表文件(外部样式表).使用<style/>元素定义嵌入式样式(嵌入式样式表).使用style特性定义针对特定 ...

  5. -_-#【减少 DOM 访问】缓存已经访问过的元素

    Minimize DOM Access Cache references to accessed elements 选择器查询是开销很大的方法.所以,使用选择器的次数应该越少越好,并且尽可能缓存选中的 ...

  6. -_-#【减少 DOM 访问】“离线”更新节点，再将它们添加到树中

    Minimize DOM Access javascript 之 DOM 优化 <!DOCTYPE html> <html> <head> <meta cha ...

  7. HTML DOM 访问2

    getElementsByTagName() 方法 getElementsByTagName() 返回带有指定标签名的所有元素. x=document.getElementById("mai ...

  8. DOM访问关系（父节点 子节点）

    把下面的知识点掌握了,可以做一下下面的案例,都是工作中常用的,很有用 知识点   1.带Eleent和不带区别     a)带Element的获取的是元素节点     b)不带Element的获取文本 ...

  9. DOM访问和处理HTML文档的标准方法

    innerHTML获取或替换HTML元素的内容 <p id="d">对于错我无法来判断 </p><script type="text/jav ...

随机推荐

  1. 50行实现简易HTTP服务器

    话说由于一直很懒,所以博客好像也没怎么更新...今天有空就写一下吧. 最近在看node.js的时候开始对http协议感兴趣了,毕竟node一开始就是为了做web服务器而产生的.于是试着想了一下大概的思 ...

  2. MYSQL 关闭服务的过程

    服务器关闭进程可以概括为: 1.    启动关闭进程 2.    服务器根据需要创建关闭线程 3.    服务器停止接收新连接 4.    服务器终止当前的活动 5.    存储引擎被停掉或关闭 6. ...

  3. c语言中 %p的含义

    格式控制符“%p”中的p是pointer(指针)的缩写.指针的值是语言实现(编译程序)相关的,但几乎所有实现中,指针的值都是一个表示地址空间中某个存储器单元的整数.printf函数族中对于%p一般以十 ...

  4. 使用MIDAS访问远程Access数据库

    使用MIDAS访问远程Access数据库         Allen Tao(http://blog.csdn.net/allentao/) 2005-5-3 本文源码下载 访问远程数据库常用的办法是 ...

  5. C++_auto

    自动变量,自动获取类型,输出,泛型 自动变量,可以实现自动循环一维数组 自动循环的时候,对应的必须是常量 //auto自动变量,自动匹配类型 #include <iostream> usi ...

  6. Tomcat配置一个ip绑定多个域名

    在网上找了半天也没找到相关的资料,都说的太含糊. 本人对tomcat下配置 一ip对多域名的方法具体例如以下,按以下配置一定能成功,经过測试了. <Host name="localho ...

  7. JS学习笔记（二）运算符和流程控制语句

    js中的运算符和流程控制,循环,判断语句都和C#基本一致,但又有其独特的运算符. typeof运算符 获得数据的数据类型,如number,string等.语法: string typeof(变量); ...

  8. JavaScript之面向对象学习八(继承)

    简介:继承是OO语言中的一个最为人津津乐道的概念.许多OO语言都支持两种继承方式:接口继承和实现继承.接口继承只继承方法签名,而实现继承则继承实际的方法. 但是JS的函数并没有签名,所以在ECMASc ...

  9. 思考----拒绝单纯copy

    工作4个多月以来感触最深的是: 做事情的时候遇到不会的可以上网查或者问别人,但是获取到的知识不能只是单纯的copy过来使用达到要求就ok, 更重要的是事后等有空了一定要仔细研究学习,使知识网络完整,这 ...

  10. Hadoop学习之Hadoop案例分析

    一.日志数据分析1.背景1.1 ***论坛日志,数据分为两部分组成,原来是一个大文件,是56GB:以后每天生成一个文件,大约是150-200MB之间: 每行记录有5部分组成:1.访问ip:2.访问时间 ...