JavaScript入门(笔记)

  JavaScript是一种轻量级、解释型的Web开发语言,该语言系统不是很庞杂,简单易学。由于所有现代浏览器都已嵌入JavaScript引擎,JavaScript源代码可以在浏览器中直接被解释执行,用户不用担心支持问题。

一、在网页中插入JavaScript代码

  使用<script>标签,可以把JavaScript源代码直接放到网页文档中。

【示例1】新建HTML文档并保存为test.html,然后在<head> 标签内插入<script>标签,在<script>标签中输入代码"<h1>Hello,World!</h1>"。完整页面代码如下。

  1. <html>
  2. <head>
  3. <meta charset="utf-8">
  4. <title>JavaScript "Hello"</title>
  5. <script>
  6. document.write("<h1>Hello,World!</h1>")
  7. </script>
  8. </head>
  9. <body>
  10.  
  11. </body>
  12. </html>

  <script>和</script>标签配合使用,作为脚本语言的标识符来分割其他源代码,避免与HTML标签和CSS样式代码混淆。

  在浏览器解析网页源代码的时,浏览器检索到<script>标签时,会自动调用JavaScript引擎对其中包含的字符信息进行解释处理。

  document是JavaScript在浏览器中定义的一个对象,它表示HTML文档内容。write()是document对象的一个方法,它表示在网页文档中输出显示指定的参数内容。

【效果】

【注意】

  1. 考虑到HTML文档的DOM结构模型规范性,建议用户把JavaScript脚本写在<head>和</head>标签之间,或者写在<body>和</body>标签之间
  2. <script>标签包含了2个属性,typelanguage。在实际开发中,可以省略这2个属性,因为浏览器默认<script>标签包含的字符信息是JavaScript脚本

二、使用JavaScript文件

  与CSS文件一样,JavaScript代码也可以存放在独立的文件中,以增强JavaScript脚本的可重复使调用。JavaScript文件是hi一个文本类型的文件,在任何文本编辑器中都可以被打开和编辑,JavaScript文件的扩展名为js。

【示例】

  1. <html>
  2. <head>
  3. <meta charset="utf-8">
  4. <title>使用JavaScript文件</title>
  5. <script type="text/javascript" src="test.js"></script>
  6. <script>
  7. var str="JavaScript编程语言";
  8. document.write("<h2>"+str+"</h2>"); //输入变量的值
  9. document.write("<p>实际长度=" + strlen(str) + "字节</p>"); //调用函数
  10. </script>
  11. </head>
  12. <body>
  13. </body>
  14. </html>
  1. //公共函数,计算字符串的实际长度
  2. function strlen(str){
  3. var len; //临时标量,存储字符串的实际长度
  4. var i; //声明循环变量
  5. len=0; //初始化临时变量len为0
  6. for (i=0; i<str.length; i++){ //循环检测字符中每个字符
  7. if (str.charCodeAt(i) > 255) len+=2; //如果当前字符串为双字节字符,则递增2次
  8. else len++; //如果当前字符为单字节字符,则递增1次
  9. }
  10. return len; //返回字符串的实际长度
  11. }

【效果】

JavaScript基础——JavaScript入门(笔记)的更多相关文章

  1. javascript基础系列(入门前须知)

    -----------------------小历史---------------------------- javascript与java是两种语言,他们的创作公司不同,JavaScript当时是借 ...

  2. JavaScript基础——JavaScript常量和变量(笔记)

    JavaScript常量和变量(笔记) Javascript代码严格区分大小写. javascript暂不支持constant关键字,不允许用户自定义常量. javascript使用var关键字声明变 ...

  3. JavaScript基础教程复习笔记

    document.write("<h1>这是一个标题</h1>"); 您只能在 HTML 输出中使用 document.write.如果您在文档加载后使用该 ...

  4. JavaScript基础——JavaScript语法基础(笔记)

    JavaScript语法基础(笔记) 1.语言编码 JavaScript语言建立在Unicode字符集基础之上,因此脚本中,用户可以使用双字节的字符命名常量.变量或函数等. [示例] var 我=&q ...

  5. JavaScript基础——JavaScript函数(笔记)

    avaScript 函数(笔记) JavaScript 是函数式编程语言,在JavaScript脚本中可以随处看到函数,函数构成了JavaScript源代码的主体. 一.定义函数 定义函数的方法有两种 ...

  6. JavaScript基础——JavaScript数据类型(笔记)

    数据类型(笔记) null和undefined 在JavaScript中有两个特殊的值: null和undefined.简单说明如下: null 是Null类型的值,Null类型的值只有一个值(nul ...

  7. JavaScript 基础知识入门

    ​ js3种弹出框 alert消息对话框 var mychar=I love JavaScript;alert(mychar); confirm消息对话框 返回值:bool var mymessage ...

  8. (译文)JavaScript基础——JavaScript中的深拷贝

    在JavaScript中如何拷贝一个对象? 通过引用调用 function mutate(obj) { obj.a = true; } const obj = {a: false}; mutate(o ...

  9. JavaScript基础Javascript中的循环(003)

    1.普通循环JavaScript中一般的循环写法是这样的: // sub-optimal loop for (var i = 0; i < myarray.length; i++) { // d ...

随机推荐

  1. Java字节流文件封装

     /**  * 字节流封装方法  */ import java.io.FileInputStream; import java.io.FileNotFoundException; import jav ...

  2. 使用PowerShell 自动安装VC++补丁

    执行环境:Windows Server 2012 R2 VC++下载链接 这里有个问题,虽说可以静默安装,但是未对当前系统检测是否已安装vc++补丁,望大佬指点 # author:lttr <w ...

  3. K Closest Points to Origin

    We have a list of points on the plane.  Find the K closest points to the origin (0, 0). (Here, the d ...

  4. 大型软件公司.Net面试常见题(含答案)

    1.a=10,b=15,在不用第三方变量的前提下,吧a.b互换 2.已知数组int[] max={6,5,2,9,7,4,0};用快速排序算法按降序对其进行排列,并返回数组 3.请简述面向对象的多态的 ...

  5. # Doing homework again(贪心)

    # Doing homework again(贪心) 题目链接:Click here~~ 题意: 有 n 门作业,每门作业都有自己的截止期限,当超过截止期限还没有完成作业,就会扣掉相应的分数.问如何才 ...

  6. 在Qt5使用中文(vs环境)

    如果是使用mingw版本的Qt create, 也就是使用GCC编译器应该没那么多事吧. 不过我还是用惯了VS呢. 好了,废话不多说,开始总结vs下乱码的解决方案. vs2003 把源码存成 utf- ...

  7. python基础之 线程_进程关系

    上图

  8. Python 入门 之 双下方法

    Python 入门 之 双下方法 1.双下方法 ​ 定义:双下方法是特殊方法,它是解释器提供的 由双下划线加方法名加双下划线 方法名的具有特殊意义的方法,双下方法主要是python源码程序员使用的,我 ...

  9. redis 学习(16)-- redis 持久化

    redis 持久化 什么是持久化 redis 将所有数据保持在内存中,对数据的更新将异步地保存在磁盘中 持久化的方式 1. 快照 快照是某时某刻对数据的完整备份. 在: MySQL Dump Redi ...

  10. 本人亲测-inno setup打包EXE(较完整实例)

    ; Script generated by the Inno Setup Script Wizard.; SEE THE DOCUMENTATION FOR DETAILS ON CREATING I ...