JavaScript基础语法

JavaScript基础

浏览器可以解析HTML+CSS+JavaScript

  1. 嵌入HTML文件中

    一般放在中

    <head>
        <script>
            alert("HY000")
        </script>
    </head>
    
  2. 定义外部文件

    将javascript代码卸载一个独立的脚本(扩展名为.js)中,在页面中使用时直接导入该脚本

    <script type="text/javascript" src="https://www.google-analytics.com/analytics.js"></script>
    <script type="text/javascripy" src="./analytics.js"></script>
    
alert("123")	/*弹窗显示123*/
  1. 在HTML的元素事件属性中

事件,通过某个动作来完成某个事

常用事件

<!--onclick点击事件-->
<input type="button" name="button" value="点我" onclick="alert(/123/)">
<input type="button" name="button2" value="鼠标移上来" onmouseover="alert('hello')">
<input type="text" name="change" onchange="alert('文本框内容更改触发事件')" value="change">
  1. 在超链接中定义
<a href="javascript:alert(/a标签/)">a标签</a>

简单的JavaScript例子

<head>
    <!-- 定义函数,完成某个操作写的代码放在这里 -->
    <script type="text/javascript">
        function Demo() {
            /*function是js中开始定义函数的一个标识,大小写敏感*/
            // 函数名用英文,demo是函数名,可以自定义,命名规范是驼峰法: demoTest
            // params是参数,可要可不要
            // {}写函数具体要做的事
            // 每行代码之后要加;
            alert("Easy Js!")        
        }
    </script>
</head>
<body>
    <input type="button" value="点我" onclick="Demo()">
</body>
<head>
    <script type="text/javascript">
        function myFun() {
            alert("Hello World");
        }
    </script>
</head>
<body>
    <!-- 在调用js函数的时候,必须注意的事项:函数名() -->
   <input type="button" name="button" value="按钮" onclick="myFun()"> 
</body>

alert(this.Document.cookie)

alert(Document.name)

<head>
    <script>
        function changeContents() {
            document.getElementById('hk').innerHTML = "New";
        }
    </script>
</head>
<body>
    <div id="hk">Raw</div>
    <br>
    <input type="button" name="bt" value="改变内容" onclick="changeContents()">
</body>
<head>
    <script>
        function changeContents() {
            alert(document.getElementById('hk').value);
        }
    </script>
</head>
<body>
    <br>
    <input type="text" name="text" id="hk" onchange="changeContents()">
</body>
<head>
    <script>
        function load(params) {
            alert("当前文档加载完毕")
        } 
    </script>
</head>
<body onload="load()">
 1 <br>
 2 <br>
 3 <br>
 4 <br>  
</body>
<head>
    <script>
        function wd() {
            // 将文档中所有内容都覆盖掉
            document.write("写锤子!");
        }
    </script>
</head>
<body>
    <input type="button" onclick="wd()" value="写!">
    这个也会被覆盖掉
</body>
<head>
    <script>
        function wd() {
            // 将文档中所有内容都覆盖掉
            document.write("<a href='https://www.baidu.com'>不会百度</a>");
        }
    </script>
</head>
<body>
    <input type="button" onclick="wd()" value="写!">
    这个也会被覆盖掉
</body>
<body>
    <script>
        document.write("document.write不需要事件触发")
    </script>
</body>

语法基础

变量:用来存放数据(可变化)的地方,在JS中变量用var来修饰,例如var test;,其中test是变量名。test可以不赋初值;如果赋初值,这叫做初始化。

var demo = "string";

var number = 12;

var gender = False

数据类型:

  1. 数字:3.14, 1001, 123e3=123*10^3

  2. 字符串:用单双引号括起来的

  3. 数组:[1, 3, 4, 5],下标从0开始,最大下标3

    [1, 'b', 0, 123, [7, 8, 11]]

  4. 对象:{name: 'LIMA', age: 20},键值对,就像Python中的字典一样。

  5. 布尔值:FalseTrue

  6. Undefined(未定义)和Null(空值)

注意:

  1. JS代码写完之后一定要加分号;
  2. JS中大小写敏感;
  3. 单行注释//,多行注释/* */
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
JavaScript基础语法包括数据类型、运算符、选择结构和循环结构。在JavaScript中,所有的类型都是用var关键字来修饰,但实际中还是有类型区分的。常见的数据类型包括字符串、数字、布尔值、对象和数组等。 运算符用于进行数学运算和逻辑判断。常见的运算符包括加法运算符(+)、减法运算符(-)、乘法运算符(*)、除法运算符(/)、取余运算符(%)等。逻辑运算符包括与运算符(&&)、或运算符(||)、非运算符(!)等。 选择结构用于根据条件执行不同的代码块。常见的选择结构有if语句、switch语句。if语句根据条件是否为真来执行相应的代码块,switch语句根据表达式的值来选择执行的代码块。 循环结构用于重复执行一段代码。常见的循环结构有for循环、while循环和do-while循环。for循环在指定条件为真的情况下重复执行代码块,while循环在条件为真的情况下重复执行代码块,do-while循环先执行一次代码块,然后在条件为真的情况下重复执行代码块。 举个例子,下面是一段JavaScript代码: ```javascript <script> var a = 10; var b = 5; console.log(a > b && b > a); console.log(a > b || b > a); </script> ``` 在这段代码中,我们定义了两个变量a和b,并使用console.log()方法分别输出了两个逻辑表达式的结果。第一行代码中,a > b && b > a的结果为false,因为a不大于b且b不大于a。第二行代码中,a > b || b > a的结果为true,因为a不大于b或b不大于a至少有一个条件成立。 这就是JavaScript基础语法的一部分,包括数据类型、运算符、选择结构和循环结构。通过掌握这些基础知识,我们可以开始编写JavaScript程序。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* *3* [【JavaScript】基本语法大全](https://blog.csdn.net/weixin_64916311/article/details/129136028)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 100%"] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值