js项目第一课：获取节点的方法有三个
第一种方法： 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项目第一课：获取节点的方法有三个的更多相关文章
- JS DOM用不同方法获取节点及对节点插入、复制和移除
操作节点的方法 appendChild() insertBefore() replaceChild() cloneNode() normalize() splitText() sppendChild( ...
- TreeView中右击直接获取节点的方法
在TreeView中无法直接右击得到一个节点,因为当你选中其中一个右击时(不能是第一个)他会默认跳到第一个. 有时我们要想直接右击得到选中的节点,又时我们又想选中直接右击跳出一个快捷菜单怎么办了! 在 ...
- 潭州课堂25班：Ph201805201 django 项目 第一课 (课堂笔记)
一.Django 现状 1.Django开发前景 1.1 老师做过的项目 项目图展示: 1.2 Django的厉害之处 在python中,与web开发环境相关的包有13045个 ...
- 原生态js获取节点的方法
<input value="我是用id来获取值的" type="button" onclick="GetById()"/> &l ...
- [妙味JS基础]第一课：属性操作、图片切换、短信发送模拟
知识点总结 HTML的属性操作:读.写 元素.属性名 => “读” 元素.属性名＝新的值 => “写” 例如: oBtn.value => “读” oBtn.value='按钮' = ...
- js函数arguments与获取css样式方法
函数传参,当参数的个数不定时,可以使用arguments:表示实参集合 arguments.length=实参个数 获得css样式方法: getComputedStyle()方法---->得到的 ...
- JS学习第一课
1.js 按照编写顺序执行 2.输出使用document.write. 3.申明数组 var array = [1,2,3,5] ; var arrStr = ["sgsg",& ...
- 作品第一课----获取批量checkbox选中的值
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 潭州课堂25班：Ph201805201 tornado 项目 第一课 项目介绍和创建 （课堂笔记）
tornado 相关说明 , 查找 python3 的路径: binbin@abc:~$ which python3/usr/bin/python3 创建虚拟环境 : 创建工程; 用 pycharm ...
随机推荐
- 计蒜客 28317.Growling Gears-一元二次方程的顶点公式 (Benelux Algorithm Programming Contest 2014 Final ACM-ICPC Asia Training League 暑假第一阶段第二场 G)
G. Growling Gears 传送门 此题为签到题,直接中学的数学知识点,一元二次方程的顶点公式(-b/2*a,(4*a*c-b*b)/4*a):直接就可以得到结果. 代码: #include& ...
- Educational Codeforces Round 33 (Rated for Div. 2) B. Beautiful Divisors【进制思维/打表】
B. Beautiful Divisors time limit per test 2 seconds memory limit per test 256 megabytes input standa ...
- HDU 1426 Sudoku Killer(搜索)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1426 题意很明确,让你解一个9*9的数独. DFS即可. #include <cstdio> ...
- Kali Linux Wine32英文字体不显示问题
Kali Linux Wine32英文字体不显示问题 Kali Linux提供了Wine32工具.在运行Wine32后,界面可以显示中文,但不能显示英文文字.英文文字均显示为方块.这是由于缺少对应的 ...
- Redis单机部署、添加开机自启、配置参数
1.Redis简介 redis是使用C语言编写的开源的,支持网络,基于内存,可持久性的键值对存储数据库,2013年5月之前,Redis是最流行的键值对存储数据库,Redis采用内存数据集,支持多种数据 ...
- response.getWriter().write()与out.print()的区别（转）
1.首先介绍write()和print()方法的区别: (1).write():仅支持输出字符类型数据,字符.字符数组.字符串等 (2).print():可以将各种类型(包括Object)的数据通过默 ...
- 将本地jar包安装进入maven仓库
实际项目中pom.xml依赖写法: <dependency> <groupId>org.springframework</groupId> <artifact ...
- MySQL 5.7.17 Group Replication 初始
http://blog.csdn.net/mchdba/article/details/53957248
- Visio对象插入Word后周围空白过大
如图,空白很大,因为我在设计里选择纸张适应绘图,后发现直接复制粘贴到word就好了,没空白了.
- linux之rpm指令
rmp原本是Red Hat Linux发行版专门用来管理Linux各项套件的程序,由于它遵循GPL规则且功能强大方便,因而广受欢迎.逐渐受到其他发行版的采用.RPM套件管理方式的出现,让Linux易于 ...