JavaScript DOM_3 获取元素节点

如何获取节点元素呢?

代码如下:

<%@ page language="java" import="java.util.*" pageEncoding="GB2312"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP ‘index.jsp‘ starting page</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	<script type="text/javascript">
		window.onload = function(){
			var bjName = document.getElementById("bj");
			alert(bjName);
			var bjId = document.getElementsByName("beijing");
			alert(bjId.length);
			var list = document.getElementsByTagName("li");
			alert(list.length);
		}
	</script>
  </head>
  
  <body>
    
    	<p>你喜欢哪个城市</p>
    	<ul id="City">
    		<li id="bj" name="beijing">北京</li>
    		<li id="Sh">上海</li>
    		<li>广州</li>
    		<li>深圳</li>
    	</ul>
    
    	<br/>
    	<p>你喜欢哪款单机游戏</p>
    	<ul id="game">
    		<li>反恐精英</li>
    		<li>魔兽</li>
    		<li>红警</li>
    		<li>实况</li>
    	</ul>
    
    
  </body>
</html>

说明:

<script type="text/javascript">
		window.onload = function(){
			var bjName = document.getElementById("bj");
			alert(bjName);
			var bjId = document.getElementsByName("beijing");
			alert(bjId.length);
			var list = document.getElementsByTagName("li");
			alert(list.length);
		}
	</script>

document.getElementById("ID"):是整个文档的方法,使用该方法时确保ID唯一。

document.getElementByName("属性名"):是对于元素自身没有的定义的属性使用该方法,例如li没有Name这个属性所以使用BYName().但是IE不支持该方法,使用需谨慎。

<script type="text/javascript">
		window.onload = function(){
			var CityNode = document.getElementById("City");
			var list = CityNode.getElementByTagName("li");
			alert(list.length);
		}
	</script>

document.getElementByTagName("TagName"):获取标签为TagName的所有元素,会在整个文档中找所有tagName的所有元素。

时间: 2024-10-12 14:11:48

JavaScript DOM_3 获取元素节点的相关文章

javascript中获取元素节点的文本

<div id="test"> <strong>i'm strong</strong> </div> 1.elementNode.innerHTML 返回的值是<strong>i'm strong</strong> 2.elementNode.innerText 返回的值是i'm strong 3.elementNode.textContent 返回的值是i'm strong 4.elementNode.child

轻松学习JavaScript二十一:DOM编程学习之获取元素节点的子节点和属性节点

我们这里所说的获取元素节点的所有子节点包含元素子节点和文本节点两种.还是拿上一篇博文的代码实例进行 分析: <span style="font-size:18px;"><span style="font-size:18px;"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1

JavaScript之怎样获取元素节点

JavaScript获取元素节点一共有三种方法,分别是通过元素ID.通过标签名字和通过类名字来获取: 1.通过元素ID属性的ID值来获得元素对象-getElementById() DOM提供了一个名为getElementById()的方法,这个方法将返回一个与括号里有着一样id值的元素节点对应的对象.他是document对象特有的函数,这个函数的参数只有一个,只能是你想要获得的元素的ID值,这个值必须放在单引号或者双引号里面. 注意:JavaScript语言区分字母大小写,所以在写getElem

获取元素节点(DOM基础 )

一.DOM 简介:以一种独立于平台和语言的方式访问和修改(添加.移动.改变或移除的方法和属性)一个文档(主要是网页)的内容和结构.是表示和处理一个HTML或XML文档的常用方法. 节点的定义:D(Web网页文档)O(document对象)M(网页文档的树形结构)M中树形结构可以理解为由节点组成.把每个标签看作一个节点.   节点的分类:以一个完成的标签为例<div id ="box">测试Div</div> 元素节点:是标签<div></div

JS获取元素节点的子节点

1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 5 <titl

获取元素节点

1.大纲 关于获取元素节点,主要有三种方式. getElementById() getElementsByTagName() getElementsByName() 2.第一种方式程序 在编写 HTML 文档时, 需确保 id 属性值是唯一的. 该方法为 document 对象的方法. 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>I

JavaScript HTML DOM 元素(节点)

JavaScript HTML DOM 元素(节点) 创建新的 HTML 元素 创建新的 HTML 元素 如需向 HTML DOM 添加新元素,您必须首先创建该元素(元素节点),然后向一个已存在的元素追加该元素. 实例 <div id="div1"><p id="p1">This is a paragraph.</p><p id="p2">This is another paragraph.<

javascript如何获取元素的tagName标签名

javascript如何获取元素的tagName标签名: 在一般的应用中,都会事先知道标签的名称,下面就简单介绍一下如何获取一个对象的标签名称.代码实例如下: window.onload=function(){ var thediv=document.getElementById("thediv"); document.write(thediv.tagName); } 以上代码可以输出thediv对象的标签名称,非常的简单,使用对象的tagName属性即可. 原文地址是:http://

根据ClassName获取元素节点

功能描述: 通过ClassName获取元素节点,并解决兼容性问题 实现效果: 编码思路: 利用getElementsByTagName选出所有元素,再根据ClassName条件进行筛选 代码示例: