JavaScript 用法

　　JavaScript 语句，会在页面加载时执行。

　　<body> 中的 JavaScript

<!DOCTYPE html>

<html>

<body>

.

.

<script>

document.write("<h1>这是一个标题</h1>");

document.write("<p>这是一个段落</p>");

</script>

.

.

</body>

</html>

　　<head> 中的 JavaScript 函数

<!DOCTYPE html>

<html>

<head>

<script>

function myFunction()

{

    document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";

}

</script>

</head>

<body>

<h1>我的 Web 页面</h1>

<p id="demo">一个段落</p>

<button type="button" onclick="myFunction()">尝试一下</button>

</body>

</html>

　　<body> 中的 JavaScript 函数

<!DOCTYPE html>

<html>

<body>

<h1>我的 Web 页面</h1>

<p id="demo">一个段落</p>

<button type="button" onclick="myFunction()">尝试一下</button>

<script>

function myFunction()

{

    document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";

}

</script>

</body>

</html>

　　外部的 JavaScript

　　也可以把脚本保存到外部文件中。外部文件通常包含被多个网页使用的代码。外部 JavaScript 文件的文件扩展名是 .js。

　　如需使用外部文件，请在 <script> 标签的 "src" 属性中设置该 .js 文件：

<!DOCTYPE html>

<html>

<body>

<script src="myScript.js"></script>

</body>

</html>

　　你可以将脚本放置于 <head> 或者 <body>中，放在 <script> 标签中的脚本与外部引用的脚本运行效果完全一致。

myScript.js 文件代码如下：

function myFunction()

{

    document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数";

}

直接写入 HTML 输出流

　　document.weite("<p>直接写入HTML输出流</p>");

对事件的反应

　　<button type="button" onclick="alert('当点击后显示的事件')“>点击按钮</button>

　　alert()函数多用在代码测试　　onclick 点击事件

改变 HTML 内容

　　x = document.getElementById("XXX")  //查找的id元素

　　x.innerHTML="Hello JavaScript";　　//配合上述的点击事件则可以实现HTML内容的改变

改变 HTML 图像

<script>

function 方法名()

{

    element=document.getElementById('元素名')

    if (element.src.match("图一"))

    {

        element.src="/images/图二.gif";

    }

    else

    {

        element.src="/images/图一.gif";

    }

}

</script>

<img id="元素名" onclick="方法名()" src="/images/pic_bulboff.gif" width="100" height="180">

改变 HTML 样式

　　x=document.getElementById("demo") //找到元素

　　x.style.color="#ff0000"; //改变样式

验证输入

　　

var x=document.getElementById("demo").value;

    if(isNaN(x)||x.replace(/(^\s*)|(\s*$)/g,"")==""){

        alert("不是数字");

    }else{

        alert("是数字");

}

JavaScript用法的更多相关文章

  1. JavaScript 用法

    JavaScript 用法 HTML 中的脚本必须位于 <script> 与 </script> 标签之间. 脚本可被放置在 HTML 页面的 <body> 和 & ...

  2. 一些奇怪的Javascript用法

    阅读AngularJS时,看到一些奇怪的Javascript用法.1.(function(){        a.work=function(){}   })(a)   声明一个匿名函数并执行 2. ...

  3. JavaScript —— 用法 输出

    用法 必须在<script>标签内 可以在<body>和<head>部分中 不限数量 <script> ... </script> 即可,不 ...

  4. JS（1） JavaScript 用法

    HTML 中的脚本必须位于 <script> 与 </script> 标签之间. 脚本可被放置在 HTML 页面的 <body> 和 <head> 部分 ...

  5. javascript:;用法集锦

    如果是个# ,就会出现跳到顶部的情况,个人收藏的几种解决方法:1:<a href="####"></a> 2:<a href="javasc ...

  6. 1. 现代 javascript 用法 简介 及 babel

    简介 包含 ECMAScript 基本概念,babel 使用 ,eslint 使用 以及新语法的介绍 和使用经验 ECMAScript 概念 ECMASctipt 是一种由 Ecma (前身为欧洲计算 ...

  7. javascript通用事件封装

    随着最近几年Html5的兴起,越来越多的应用采用html5进行实现,一个优秀的网页应用不但需要美观简洁的UI界面,更需要一个良好的交互.网页应用大部分的交互需要用javascript事件进行实现.虽然 ...

  8. JavaScript语法（一）

    JavaScript 用法 HTML 中的脚本必须位于 <script> 与 </script> 标签之间. 脚本可被放置在 HTML 页面的 <body> 和 & ...

  9. JavaScript对SVG进行操作的相关技术

    原文地址:http://www.ibm.com/developerworks/cn/xml/x-svgscript/   本文主要介绍在 SVG 中通过编程实现动态操作 SVG 图像的知识. SVG ...

随机推荐

  1. ajax一些东西

    jquery中的ajax方法参数总是记不住,这里记录一下. 1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为String类型的参数,请求方式(p ...

  2. win7下配置mysql的my.ini文件

    一.环境 操作系统是win7 x64, mysql是5.6.40. 二. 怎么配置? 修改my.ini文件, 添加[client], 在下面加一行 default-character-set=utf8 ...

  3. 报错Domain=NSCocoaErrorDomain Code=3840 "Garbage at end."

    网络请求出现报错:Domain=NSCocoaErrorDomain Code=3840 "Garbage at end." 出现的问题是后台返回了两次json数据!

  4. 熟悉HBase基本操作

    1. ssh localhost start-dfs.sh start-hbase.sh hbase shell create 'Student', 'S_No', 'S_Name', 'S_Sex' ...

  5. [Swift]LeetCode889. 根据前序和后序遍历构造二叉树 | Construct Binary Tree from Preorder and Postorder Traversal

    Return any binary tree that matches the given preorder and postorder traversals. Values in the trave ...

  6. 机器学习入门16 - 多类别神经网络 (Multi-Class Neural Networks)

    原文链接:https://developers.google.com/machine-learning/crash-course/multi-class-neural-networks/ 多类别分类, ...

  7. apollo客户端springboot实战（四）

    1. apollo客户端springboot实战(四) 1.1. 前言   经过前几张入门学习,基本已经完成了apollo环境的搭建和简单客户端例子,但我们现在流行的通常是springboot的客户端 ...

  8. 【Docker】(2)---仓库、镜像、容器

    [Docker](2)---仓库.镜像.容器     学习Docker,我觉得首先要了解的是仓库.镜像.容器到底是什么,他们有什么区别. 一.通俗理解 1.Docker 镜像 (images) 容器运 ...

  9. Python常见面试题

    Q 1:Python 有哪些特点和优点? 作为一门编程入门语言,Python 主要有以下特点和优点: ● 可解释● 具有动态特性● 面向对象● 简明简单● 开源● 具有强大的社区支持当然,实际上 Py ...

  10. 根据地址查询经纬度Js

    <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>根据地址查询经纬度</ ...