JavaScript+JQuery——初始JavaScript（1）_javascript+jquery语言-优快云博客

本文链接：https://blog.youkuaiyun.com/HGninjago/article/details/125012392

本文介绍JavaScript的基础知识，包括如何使用JavaScript创建简单的网页交互效果，掌握基本语法及数据类型的判断方法，同时还涉及字符串操作和数组的基本应用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

JavaScript是一种具有函数优先的轻量级，解释型或即时编译型的编程语言

在学习JavaScript之前建议先学习HTML+CSS 不过都所搜这个了想必都学过了废话不说直接开始

JavaScript第一章内容主要是了解JavaScript能做什么，掌握他的基本语法，以及开发工具和其中函数的应用

一.Hello JavaScript（入门必hello）直接代码展示

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>初识JS</title>
</head>
<body>
    <input type="button" value="弹出消息框" onclick="javascript:alert('javascript')">
    <script type="text/javascript">//同时这也通过外链式接入js文件
        document.write("hello word")//document.write();向页面输出可以包含HTml的标签内容 
        document.write("<h1>您好</h1>")
    </script>
</body>
</html>

二.JavaScript基础语法

1.对于数据类型想必大家都在学习HTML和CSS或者其他编程语言的适合都有所了解了所以就不做过多讲解了这个地方就一点数据类型判断（如若界面没有显示就表明你输入的代码中有不易发现的小问题请仔细检查）

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>判断数据类型tyoeof</title>
</head>
<body>
    <script type="text/javascript">
        document.write("数值判断<br/>")
        var width,height=10,name="张三";
        var date=new Date(); //获取时间日期对象
        var arr=new Array(); //定义数组
        document.write("width:"+typeof(width)+"<br/>");
        document.write("width:"+typeof(date)+"<br/>");
        document.write("width:"+typeof(arr)+"<br/>");
    </script>
</body>
</html>

2.String类型

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>String类型常用方法</title>
</head>
<body>
    <script type="text/javascript">
        var str="Hello World";
        document.write(str.indexOf("W")); //查询字符串出现的位置 其包含两个参数第一个是要查找的字符串第二个是从什么位置开始查找
        document.write(str.charAt(5)); //返回指定位置的字符
        document.write(str.toLowerCase()); //把字符转换成小写
        document.write(str.toUpperCase()); //把字符转换成大写
        document.write(str.substring(5,8)); //返回指定位置之间的字符串 包括前者不包括后者
        document.write(str.split()); //将字符串分割成字符串数组
    </script>
</body>
</html>

3.数组（<br/>用于换行我没找到有更好的办法）

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>数组</title>
</head>
<body>
    <script type="text/javascript">
        var str= new Array(5);
        str[0]="秋风踏红叶";
        str[1]="耳畔闻鹿鸣";
        var str1=str.lengthz;
        //常用属性
        document.write(str1); //设置返回数组内的元素数目
        document.write("<br/>"); 
        document.write(str.join("-")); //把数组的所有元素放入一个字符串，并通过分隔符隔离
        document.write("<br/>"); 
        document.write(str.sort()); //对数组排序
        document.write("<br/>"); 
        document.write(str.push("飘摇风雨中")); //向数组末尾添加一个或多个元素 并返回长度
    </script>
</body>
</html>

本次文章就到这里代码这东西就是多打多练没有捷径的哦！