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. 多路分支----switch语句

    switch-case与if-else有相似的作用,都是表达分支的方式. 语法形式: switch(type){ case 常量1: do something; break; case 常量2: do ...

  2. java爬虫案例学习

    最近几天很无聊,学习了一下java的爬虫,写一些自己在做这个案例的过程中遇到的问题和一些体会1.学习目标         练习爬取京东的数据,图片+价格+标题等等 2.学习过程 1·开发工具      ...

  3. 使用SSM重新开发计科院网站

    一.游览 在游览器地址栏输入:http://localhost:8080/index,即访问计科院首页,由于前期对数据库以及JavaBean的设计考虑不够充分,导致后期的代码臃肿,所以项目启动时对首页 ...

  4. ubuntu14.04 安装lnmp + redis

    1.更新源 apt-get install update 2.安装nginx : apt-get install nginx 配置nginx: ① cd /etc/sites-enabled/ ② v ...

  5. Android简单计时器

    本文利用ContextMenu(上下文菜单),Chronometer实现简单计数器. Main.xml: <?xml version="1.0" encoding=" ...

  6. .Net深入实战系列—JSON序列化那点事儿

    序 当前主流的序列化JSON字符串主要有两种方式:JavaScriptSerializer及Json.net(Nuget标识:Newtonsoft.Json).JavaScriptSerializer ...

  7. 操作系统中 heap 和 stack 的区别

    操作系统中 heap 和 stack 的区别heap 和 stack是什么堆栈是两种数据结构.堆栈都是一种数据项按序排列的数据结构,只能在一端(称为栈顶(top))对数据项进行插入和删除.==在单片机 ...

  8. [Swift]LeetCode27. 移除元素 | Remove Element

    Given an array nums and a value val, remove all instances of that value in-place and return the new ...

  9. 利用U盘安装win2008r2系统的步骤

    我们在公司或者家里,经常要安装各种系统,最近公司需要重新安装win2008r2系统.折腾了一天的时间,终于把系统装好了.将安装的步骤记录下来,方便大家查看,自己也做个记录. 1 准备win2008r2 ...

  10. 机器学习 GBDT+xgboost 决策树提升

    目录 xgboost CART(Classify and Regression Tree) GBDT(Gradient Boosting Desicion Tree) GB思想(Gradient Bo ...