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 ...
随机推荐
- Python的网络编程[5] -> BOOTP + TFTP + FTP -> 实现一个简单的文件传输流程
BOOTP-TFTP-FTP 目录 文件传输流程 服务器建立过程 客户端建立过程 1 文件传输流程 / File Transfer Flow 利用BOOTP,TFTP,FTP三种传输协议,建立起客户端 ...
- POJ 2441 Arrange the Bulls(状压DP)
[题目链接] http://poj.org/problem?id=2441 [题目大意] 每个人有过个喜欢的篮球场地,但是一个场地只能给一个人, 问所有人都有自己喜欢的场地的方案数. [题解] 状态S ...
- Android简单文件浏览器源代码 (转)
Android简单文件浏览器源代码 (转) activity_main .xml <LinearLayout xmlns:android="http://schemas.android ...
- C#的多线程——使用async和await来完成异步编程(Asynchronous Programming with async and await)
https://msdn.microsoft.com/zh-cn/library/mt674882.aspx 侵删 更新于:2015年6月20日 欲获得最新的Visual Studio 2017 RC ...
- Visual Studio Package扩展——vsct文件简介
首先我们使用向导生成一个package的扩展,里面就会发现一个vsct文件.vsct文件的全称是Visual Studio Command Table,它其实就是一个xml文件,通过一定的规则来描述v ...
- SQL Server 系统函数
一组内置函数,对 SQL Server 中的值.对象和设置执行操作,并返回有关它们的信息. 系统函数 功能 APP_NAME() 返回当前会话的应用程序名称(如果应用程序进行了设置) CASE表达 ...
- Shell--Bash shell的操作环境
一.路径与命令查找顺序 1.以相对/绝对路径执行命令,例如“/bin/ls”或“./ls”; 2.由alias找到该命令来执行 3.由bash内置的(builtin)命令来执行 4.通过$PATH这个 ...
- java的Commons包简介
http://mxdxm.iteye.com/blog/758453 Jakarta Commons是Jakarta的一个子项目,目的是创建和维护独立于其他框架和产品的程序包(packages).Ja ...
- oracle find blocking session
show current session id select sid from v$mystat where rownum=1; show blocking session selec ...
- 软件测试技术---Web应用软件测试
从测试的角度看,Web应用软件的以下特点会导致Web应用软件的测试有别于其他软件的测试 1.基于无连接协议 2.内容驱动 3.开发周期短 4.演化频繁 5.安全性要求较高 6.美观性要求较高 Web应 ...