<html>
<body> <h1>My First Web Page</h1> <p id="demo">A Paragraph.</p> <button type="button" onclick="myFunction()">点击这里</button> <script>
function myFunction()
{
document.getElementById("demo").innerHTML="My First JavaScript Function";
}
</script> </body>
</html>

js 查找 HTML 元素

  • 1通过 id 找到 HTML 元素
  • 2通过标签名找到 HTML 元素
  • 3通过类名找到 HTML 元素

1:通过 id 找到 HTML 元素

<html>
<body> <p id="intro">Hello World!</p>
<p>本例演示 <b>getElementById</b> 方法!</p> <script>
x=document.getElementById("intro");
document.write('<p>id="intro" 的段落中的文本是:' + x.innerHTML + '</p>');
</script> </body>
</html>

2:通过标签名找到 HTML 元素

<html>
<body> <p>Hello World!</p> <div id="main">
<p>The DOM is very useful.</p>
<p>本例演示 <b>getElementsByTagName</b> 方法。</p>
</div> <script>
var x=document.getElementById("main");
var y=x.getElementsByTagName("p");
document.write('id 为 "main" 的 div 中的第一段文本是:' + y[0].innerHTML);
</script> </body>
</html>

js被引入html网页中的方式:

1html的head和body中的引用:

<html>
<body> <h1>My First Web Page</h1> <p id="demo">A Paragraph.</p> <button type="button" onclick="myFunction()">点击这里</button> <script>
function myFunction()
{
document.getElementById("demo").innerHTML="My First JavaScript Function";
}
</script> </body>
</html>

2:html外部引用:

<html>
<body> <h1>My Web Page</h1> <p id="demo">A Paragraph.</p> <button type="button" onclick="myFunction()">点击这里</button> <p><b>注释:</b>myFunction 保存在名为 "myScript.js" 的外部文件中。</p> <script type="text/javascript" src="/js/myScript.js"></script> </body>
</html>

html base2的更多相关文章

  1. 初等数论-Base-2(扩展欧几里得算法,同余,线性同余方程,(附:裴蜀定理的证明))

    我们接着上面的欧几里得算法说 扩展欧几里得算法 扩展欧几里德算法是用来在已知a, b求解一组x,y,使它们满足贝祖等式\(^①\): ax+by = gcd(a, b) =d(解一定存在,根据数论中的 ...

  2. BASE2(matlab)

    %{ // %} clc % linspace(3,5) 3到5 分成100 default %{ a=1 b=2 str = [num2str(a),'+',num2str(b)] eval(str ...

  3. Python:Base2(List和Tuple类型, 条件判断和循环,Dict和Set类型)

    1.Python创建list: Python内置的一种数据类型是列表:list.list是一种有序的集合,可以随时添加和删除其中的元素. 比如,列出班里所有同学的名字,就可以用一个list表示: &g ...

  4. javascript arguments(转)

    什么是arguments arguments 是是JavaScript里的一个内置对象,它很古怪,也经常被人所忽视,但实际上是很重要的.所有主要的js函数库都利用了arguments对象.所以agru ...

  5. WPF - 属性系统 (2 of 4)

    属性更改回调 前一章的示例中,对各个参数的设置都非常容易理解.如果我们仅仅需要创建一个独立的依赖项属性,那么上面所提到的创建依赖项属性的基础知识足以满足需求.但是事情往往并非如此完美.在一个系统中,很 ...

  6. Javascript数组操作

    使用JS也算有段时日,然对于数组的使用,总局限于很初级水平,且每每使用总要查下API,或者写个小Demo测试下才算放心,一来二去,浪费不少时间:思虑下,堪能如此继续之?当狠心深学下方是正道. 原文链接 ...

  7. 4种解决json日期格式问题的办法

    4种解决json日期格式问题的办法   开发中有时候需要从服务器端返回json格式的数据,在后台代码中如果有DateTime类型的数据使用系统自带的工具类序列化后将得到一个很长的数字表示日期数据,如下 ...

  8. 《UNIX环境高级编程》笔记——2.标准和实现

    随着UNIX各种衍生版本不断发展壮大,标准化工作就十分必要.其实干啥事都是这样,玩的人多了,必须进行标准化. 一.UNIX标准 1.1 ISO C(ANSI C) ANSI:Amerocan Nato ...

  9. Standard C 语言标准函数库介绍

    全面巩固所知所学,往精通方向迈进! Standard C 语言标准函数库速查 (Cheat Sheet) from:http://ganquan.info/standard-c/function/ C ...

随机推荐

  1. chapter 13_4 跟踪table的访问

    __index和__newindex都是在table中没有所需访问的index时才发挥作用. 因此,只有将一个table保持为空,才有可能捕捉到所有对它的访问.为了监视一个table的所有访问,就应该 ...

  2. shell 之awk 关联数组高级应用

    最近由于数据迁移过,有些用户信息需要再次确认下,也许数据量比较大,但是需要最终确认的比如说是用户ID和其对应的用户积分数,这样就会导致出现文本a(老的数据),文本b(新的数据).比如 这是文本a.tx ...

  3. NOIP2005-普及组复赛-第一题-陶陶摘苹果

    题目描述 Description 陶陶家的院子里有一棵苹果树,每到秋天树上就会结出10个苹果.苹果成熟的时候,陶陶就会跑去摘苹果.陶陶有个30厘米高的板凳,当她不能直接用手摘到苹果的时候,就会踩到板凳 ...

  4. Wsyscheck(系统检测维护工具) v1.68.33绿色版

    软件名称:系统检测维护工具(Wsyscheck) v1.68.33绿色版软件类别:国产软件运行环境:windows软件语言:简体中文授权方式:免费版软件大小:1022 KB软件等级:整理时间:2011 ...

  5. 2.编写IoDemo.java的Java应用程序,程序完成的功能是:首先读取text.txt文件内容,再通过键盘输入文件的名称为iodemo.txt,把text.txt的内容存入iodemo.txt

    package zuoye; import java.io.File; import java.io.FileInputStream; import java.io.FileOutputStream; ...

  6. JPA 系列教程19-jpa-uuid主键生成策略

    ddl语句 CREATE TABLE `t_user` ( `id` varchar(32) NOT NULL, `name` varchar(255) DEFAULT NULL, PRIMARY K ...

  7. sql 判断表是否存在,判断列是否存在

    判断表是否存在: 语法: SELECT * FROM dbo.SysObjects where id = object_id(N'表名') 例子: SELECT * FROM dbo.SysObjec ...

  8. js实现url链接encode加密

    function urlencode(clearString) { var output = ''; var x = 0; clearString = utf16to8(clearString.toS ...

  9. 用python写刷票程序

    刷票一般要突破以下限制: 1.验证码识别 2.同一ip不可连续投票 解决办法 1.用tesseract工具,链接在此 https://code.google.com/p/tesseract-ocr/  ...

  10. OS X快捷键最最齐全版(官方版)

    看大家不时的都在将系统发快捷键最新版,在官网上其实就有这个最详细的信息,为了方便大家.另外系统快捷键不会更新那么快,也就不存在最新版了.小弟现将原文转发过来,希望对新入门或需要的小伙伴有帮助.OS X ...