第一种方法：

demo.html代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>项目前端</title>

<script type="text/javascript" src = "base.js"></script>

<script type="text/javascript" src = "demo.js"></script>

</head>

<body>

    <div id = "box">id</div>

    <input type = "radio" name="sex" value="男" checked="checked"/>

    <p>段落</p>

</body>

</html>
demo.js：代码如下
window.onload = function(){

    alert(document.getElementById("box").innerHTML);//弹出id

    alert(document.getElementsByName("sex")[0].value);//弹出男

    alert(document.getElementsByTagName("p")[0].innerHTML);//弹出段落

}

第二种方法：函数式写法

//base.js代码如下：
function $(id){

	return document.getElementById(id);

}

　　

//demo.js代码如下

window.onload=function(){

	alert($("box").innerHTML);

}

　　也能实现同样的效果

第三种方法：对象方法来封装实现获取节点的方法（推荐此种方法）

//base.js用对象来封装代码：

var Base = {

	getId:function(id){

		return document.getElementById(id);

	},

	getName:function(name){

		return document.getElementsByName(name);

	},

	getTagName:function(tag){

		return document.getElementsByTagName(tag);

	}

};　　
//demo.js调用封装的方法

window.onload = function(){

    alert(Base.getId("box").innerHTML);

    alert(Base.getName("sex")[0].value);

    alert(Base.getTagName("p")[0].innerHTML);

}

js项目第一课：获取节点的方法有三个的更多相关文章

  1. JS DOM用不同方法获取节点及对节点插入、复制和移除

    操作节点的方法 appendChild() insertBefore() replaceChild() cloneNode() normalize() splitText() sppendChild( ...

  2. TreeView中右击直接获取节点的方法

    在TreeView中无法直接右击得到一个节点,因为当你选中其中一个右击时(不能是第一个)他会默认跳到第一个. 有时我们要想直接右击得到选中的节点,又时我们又想选中直接右击跳出一个快捷菜单怎么办了! 在 ...

  3. 潭州课堂25班：Ph201805201 django 项目 第一课 (课堂笔记)

    一.Django 现状   1.Django开发前景   1.1 老师做过的项目   ​ 项目图展示:     1.2 Django的厉害之处 在python中,与web开发环境相关的包有13045个 ...

  4. 原生态js获取节点的方法

    <input value="我是用id来获取值的" type="button" onclick="GetById()"/> &l ...

  5. [妙味JS基础]第一课：属性操作、图片切换、短信发送模拟

    知识点总结 HTML的属性操作:读.写 元素.属性名 => “读” 元素.属性名＝新的值 => “写” 例如: oBtn.value => “读” oBtn.value='按钮' = ...

  6. js函数arguments与获取css样式方法

    函数传参,当参数的个数不定时,可以使用arguments:表示实参集合 arguments.length=实参个数 获得css样式方法: getComputedStyle()方法---->得到的 ...

  7. JS学习第一课

    1.js 按照编写顺序执行 2.输出使用document.write. 3.申明数组 var array = [1,2,3,5] ;  var arrStr = ["sgsg",& ...

  8. 作品第一课----获取批量checkbox选中的值

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. 潭州课堂25班：Ph201805201 tornado 项目 第一课 项目介绍和创建 （课堂笔记）

    tornado 相关说明 , 查找 python3 的路径: binbin@abc:~$ which python3/usr/bin/python3 创建虚拟环境 : 创建工程; 用 pycharm ...

随机推荐

  1. 安装mysql数据库图文教程

    一.首先下载该版本的Mysql  5.5.28双击软件,弹出软件的安装界面如下 二.点击Next  ,点击同意

  2. 分层图【p2939】[USACO09FEB]改造路Revamping Trails

    Description 约翰一共有N)个牧场.由M条布满尘埃的小径连接.小径可 以双向通行.每天早上约翰从牧场1出发到牧场N去给奶牛检查身体. 通过每条小径都需要消耗一定的时间.约翰打算升级其中K条小 ...

  3. HDU 5916: Harmonic Value Description

    题目描述 The harmonic value of the permutation $p_1,p_2,\cdots p_n$ is$$\sum_{i=1}^{n-1} gcd(p_i.p_{i+1} ...

  4. 2.5多线程（Java学习笔记）生产者消费者模式

    一.什么是生产者消费者模式 生产者生产数据存放在缓冲区,消费者从缓冲区拿出数据处理. 可能大家会问这样有何好处? 1.解耦 由于有了缓冲区,生产者和消费者之间不直接依赖,耦合度降低,便于程序拓展和维护 ...

  5. Implicit declaration of function 'ether_ntoa' is invalid in C99

    报错代码: strcpy(temp, (char *)ether_ntoa(LLADDR(sdl))); 解决方法: 导入这三个头文件即可, #include <sys/types.h> ...

  6. Windows下将ISO镜像制作成U盘启动的工具（U盘启动工具/UltraISO/Rufus/Universal-USB）

    说明:基于Windows的U盘启动制作都是非常的简单,在软件上指定ISO文件之后,一般都是选择写入到哪个U盘即可. 1.UltraISO 2.Rufus 3.Universal-USB 4.大白菜

  7. PHP的一些陷阱

    1,空Array为False $a = array() if($a == false) { echo "This will be printed ! ! !" ; } 持续更新中

  8. jQuery插件开发 总结

    一般来说,jQuery插件的开发分为两种:一种是挂在jQuery命名空间下的全局函数,也可称为静态方法:另一种是jQuery对象级别的方法,即挂在jQuery原型下的方法,这样通过选择器获取的jQue ...

  9. ansible的inventory文件含义

    默认文件为/etc/ansible/hosts 例如 [test] web.yinzhipeng.com dhcp ansible_ssh_host=172.16.18.195 1.中括号中的名字代表 ...

  10. [置顶] kubernetes资源对象--ResourceQuotas

    概念 Resource Quotas(资源配额,简称quota)是对namespace进行资源配额,限制资源使用的一种策略. K8S是一个多用户架构,当多用户或者团队共享一个K8S系统时,SA使用qu ...