当前位置:

在HTML使用javaScript

访客 2024-04-24 498 0

一.在HTML中使用javaScript的方法

把javaScript代码写在<script>...</script>标签中,将标签插入到网页中

1.内部和外部

2.代码可以编写在head,body,body外,html外

  • <html>
  • <head>
  • <metacharset="utf-8"/>
  • <title></title>
  • <!--javascript代码是在script标签中编写-->
  • <!--js代码可以编写在head,body,body外,html外-->
  • <!--<scripttype="text/javascript">
  • alert("Helloword!")
  • </script>-->
  • <!--引入css样式-->
  • <linkrel="stylesheet"type="text/css"href="css/new_file.css"/>
  • <!--引入js样式-->
  • <scripttype="text/javascript"src="js/index.js"></script>
  • </head>
  • <body>
  • <h1class="main">h1标签</h1>
  • <ahref="http://www.百度.com"class="m"href="javascript:alert('百度')">百度</a>
  • <scripttype="text/javascript">
  • alert("Helloword!")
  • </body>
  • </html>
  • //外部引用
  • alert("这是一个外部js文件")
  • 二.JavaScript的数据类型

    基本数据类型引用数据类型

    数值数据类型number字符串类型string

    布尔类型booleanArray数组类型

    未定义数据类型undefined对象类型Object

    空数据类型null

    使用typeof运算符可以查看变量的数据类型

    在js中,变量的数据类型跟该变量后面赋的值的类型有关

  • <html>
  • <head>
  • <metacharset="utf-8"/>
  • <title></title>
  • </head>
  • <body>
  • <scripttype="text/javascript">
  • //声明一个变量,用来储存学生姓名
  • varstuName//声明一个变量
  • stuName="张三"//给变量stName进行赋值
  • alert(stuName)//通过弹出框的方式将变量的值弹出
  • document.write(stuName)//将变量的值打印在页面上
  • document.write("<br/>")//换行
  • document.write(stuName)
  • //经常用于代码调试,通过控制台进行打印输出
  • console.log(stuName)
  • //在声明时直接给变量赋值
  • varstuSex="男"
  • //同时声明多个变量
  • //varx,y,z=10
  • varx=y=z=10
  • console.log(x)
  • console.log(y)
  • console.log(z)
  • //查看变量的数据类型
  • console.log(typeofstuName)//string类型
  • console.log(typeofstuSex)//number类型
  • varischecked=true
  • console.log(typeofischecked)//boolean类型
  • //在js中,变量的数据类型跟该变量后面赋的值的类型有关
  • 后面的值是什么
  • //多种数据类型进行混合运算
  • console.log(1012.5)
  • console.log(typeof(10"12.5"))
  • console.log(typeof(10true))
  • console.log(10true)
  • </script>
  • </body>
  • </html>
  • 三.混合计算数据类型

    整数与小数=小数小数与布尔型=小数

    整数与字符串=字符串小数与空值=小数

    整数与布尔型=整数字符串与布尔型=字符串

    整数与空值=整数字符串与空值=字符串

    小数与字符串=字符串布尔型与空值=整数

  • <html>
  • <head>
  • <metacharset="utf-8"/>
  • <title></title>
  • </head>
  • <body>
  • <scripttype="text/javascript">
  • //多种数据类型进行混合运算
  • console.log(1012.5)
  • console.log(typeof(10"12.5"))
  • console.log(typeof(10true))
  • console.log(10true)
  • </script>
  • </body>
  • </html>
  • <html>
  • <head>
  • <metacharset="utf-8">
  • <title></title>
  • </head>
  • <body>
  • <scripttype="text/javascript">
  • varnum_1=prompt("请输入第一个数字:")
  • varnum_2=prompt("请输入第二个数字:")
  • console.log(typeofnum_1)
  • console.log(typeofnum_2)
  • //parseInt():将一个字符串类型转换成整数
  • varresult=parseInt(num_1)parseInt(num_2)
  • console.log(result)
  • //parseFloat():将一个字符串类型转换成小数
  • console.log(parseFloat("12.5"))
  • </script>
  • </body>
  • </html>
  • parseInt():将一个字符串类型转换成整数

    parseFloat():将一个字符串类型转换成小数

    发表评论

    • 评论列表
    还没有人评论,快来抢沙发吧~