JavaScript快速入门+文档查询【详解】

已于 2024-03-04 14:49:12 修改
阅读量1.8k 收藏 34
点赞数 21
文章标签： javascript 开发语言 ecmascript
于 2024-03-04 01:36:32 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_52748334/article/details/136441350
版权

目录

1. js简介

2.js引入方式

3. JS基础语法(ECMAScript)

4. js函数和事件【js的核心】

5.js对象

 6.BOM对象

7.DOM对象        

8.案例全选全消

1. js简介

        1.什么是js

        JavaScript，简称js，是web开发中不可缺少的脚本语言，不需要编译就能运行（解释型语言）。在传统的web开发里，它“寄生”在html体内放在服务器上，随网络传输到客户端，在浏览器里运行

        2.js作用

        监听用户的动作：使用的是js的事件监听机制

        可以操作浏览器的行为：比如让浏览器弹窗、历史记录的前进、后退等等

        可以改变网页的内容：可以修改html标签、标签的属性、标签的样式，然后页面显示的效果就会随之改变

2.js引入方式

         内部js：在html里任意位置添加<script> 在这里写js代码 </script>标签，在标签内部写js代码

        外部js：把js代码写到单独的js文件里，html中使用<script src="js文件路径"></script>引入js文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>引入js</title>
</head>
<body>
    
    
    <!-- 引入方式1. 在html里直接添加script标签，把js代码写在script标签内部 -->
    <script>
        alert("内部js");
    </script>

    <!-- 引入方式2. 把js代码写在单独的js文件里，html中使用script标签引入js文件 -->
    <script src="./js/demo.js"></script>
</body>
</html>

3. JS基础语法(ECMAScript)

        1.基础语法

        区分大小写

        每行结尾的分号可有可无

        注释的写法：

                单行注释：// 注释内容

                多行注释：/* 注释内容 */

        js常用的打印输出语句有：

        

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>js基础语法</title>
</head>
<body>
    hello, javascript

    
    <script>
        //1. js区分大小写
        //2. 每行结尾的分号可写可不写
        //3. 注释的写法和Java一样

        // 使用浏览器弹窗
        window.alert("JavaScript简称js");

        // 把内容输出到页面上
        document.write("JavaScript借鉴了Java，但两者没有关系");

        // 把内容打印到浏览器控制台。
        // 使用浏览器打开此页面后，按F12，找到“Console”或者“控制台”就能看到输出的内容
        console.log("布兰登·艾克用了10多天就创建了JavaScript语言");
    </script>
</body>
</html>

        

        2.变量和常量定义

        在js中，变量的声明和java中还是不同的。首先js中主要通过如下3个关键字来声明变量的：

     命名规范：和Java相似

                组成字符可以是任何字母、数字、下划线（_）或美元符号（$）

                数字不能开头

                建议使用驼峰命名

             

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>js变量定义</title>
</head>
<body>
    
    <script>
        //js中一切变量定义都使用：let，无论是什么类型的变量
        //  老版本的js(ECMAScript5)中，使用var定义变量。从ECMAScript6开始，建议使用let定义变量
        let v1 = 3;
        let v2 = "hello";
        let v3 = true;
        let v4 = new Date();

        //js中的常量定义使用：const
        //  常量不允许修改值，执行代码时会报错（打开浏览器的F12，控制台里可看到报错信息）
        const PI = 3.14;
        PI = 3.1415;
    </script>
</body>
</html>

        3.数据类型和运算符

        虽然js是弱类型语言，但是也有数据类型，分为 ：原始类型 和 引用类型

        

        

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>js的数据类型</title>
</head>
<body>
    
    <script>
        //使用`typeof`函数判断变量的类型
        console.log(typeof 3); //number
        console.log(typeof "3") //string
        console.log(typeof true) //boolean
        console.log(typeof null) //object
        console.log(typeof undefined) //undefined

        let v;
        console.log(typeof v) //undefined。声明变量但未初始化，是undefined
    </script>
</body>
</html>

         js的运算符：绝大多数还是和java中一致

           

        

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>运算符</title>
</head>
<body>
    
    <script>
        //算术运算符：+, -, *, /, %, ++, --
        //赋值运算符：+=, -=, *=, /=, %=, =
        //比较运算符：>, <, >=, <=, ==, !=, ===, !==
        //逻辑运算符：&&, ||, !
        //三元运算符

        console.log(3 == "3") //结果是true。因为==只比较值，只要值相同，结果就是true
        console.log(3 === "3")//结果是false。因为===比较值和类型，只有两个都相同，结果才是true
    </script>
</body>
</html>

        4.流程控制语句

        js的流程控制语句和Java非常相似，也有：

                if, else, else if：用于条件判断

                for，while，do while：用于循环遍历

        用法也和Java的流程控制语句几乎相同，所以这里只介绍一个特殊情况：if判断

                js里条件判断，通常用于判断boolean值

                js也能对任意类型的值进行if判断：

        数字类型的0，对象类型的null，字符串类型的""，还有undefined判断为false

 

<html>
    <head>
        <title></title>
    </head>
    <body>
        
        <script>
        	if(0){
               console.log("0判断为true")
            }else{
               console.log("0判断为false")
            }
            
            if(""){
                console.log("空字符串判断为true")
            }else{
                console.log("空字符串判断为false")
            }
            
            if(null){
                console.log("null判断为true")
            }else{
                console.log("null判断为false")
            }
            
            if(undefined){
                console.log("undefined判断为true")
            }else{
                console.log("undefined判断为false")
            }
        </script>
    </body>
</html>

4. js函数和事件【js的核心】

   1.函数名两种:    

        普通函数：有名称的函数，通过函数名来调用函数

        匿名函数：没有名的函数，要么赋值给一个变量然后通过变量名调用，要么把函数直接作为其它函数的实参     

注意：

  • js里没有函数重载，同名函数会覆盖掉

  • js的形参不需要声明类型，直接写形参名称即可

  • js的函数不写返回值类型，如果需要返回，在函数里直接return即可

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>js的函数</title>
</head>
<body>
    
    <script>
        //js的函数：相当于Java里的方法，都是用于复用代码的
        
        //1. 普通函数。不需要写返回值类型；形参不需要写类型；
        function add(a, b){
            return a+b;
        }
        let res = add(3, 5);
        console.log(res)

        //2. 匿名函数。通常赋值给一个变量，通过变量名调用函数；也可以把匿名函数直接作为另外一个函数的实参
        let fn = function(a, b){
            return a * b;
        }
        let res2 = fn(3, 5);
        console.log(res2)
    </script>
</body>
</html>

        2.案例轮播图:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>轮播图</title>
</head>

<body>

<!--
    轮播图，需求：
        打开页面之后，页面上显示一张图片
        每间隔2秒钟，切换一张图片
    分析：
        1. 无论图片如何切换，必须要显示图片：就必须要使用img标签
        2. 每间隔2秒钟做一些事情：周期性的执行任务，setInterval(函数对象, 2000)
        3. 如何切换图片？只要把img的src属性值修改，就可以切换图片
            需要使用js修改img的src属性值：document.getElementById("image").src = "新值"
-->

<img src="./image/1.jpg" alt="" id="image" width="500px">
<script>
    //1. 把资料里的1.jpg到5.jpg拷贝到 VSCode的image文件夹里
    //2. 创建html页面，实现轮播图
    let image = document.getElementById("image");
    let filename = 1;
    setInterval(function() {
        if(++filename > 5){
            filename = 1;
        }
        image.src = "./image/" + filename + ".jpg";
    }, 2000);
</script>
</body>
</html>

         3.js事件

                事件：用户的一些动作，或者浏览器的一些状态变化。js提供了监听事件的一些属性

                事件源：事件发生在哪。通常是html标签上

                响应行为：事件发生后，要执行的代码、实现的功能

            常见事件：

        绑定语法：        

                普通函数方式绑定，语法：<input type="button" value="按钮" onclick="show()">

                匿名函数方式绑定，纯js方式绑定，

                语法：document.getElementById("事件源标签id").onclick= function(){}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>事件绑定1</title>
</head>
<body>
<!--
需求：按钮点击时弹窗“点我干嘛”
分析：监听到按钮上发生  “被点击了” 事件时，要弹窗“点我干嘛”
    事件源：按钮
    事件：单击事件，要使用“onclick"监听到
    响应行为： 弹窗“点我干嘛”
实现：
    在事件源标签上加属性onclick，值是js代码“调用一个函数”
-->
<input type="button" value="按钮1" onclick="show()">
<input type="button" value="按钮2" id="btn2">

<script>
    function show(){
        alert("点我干嘛1");
    }
    
    document.getElementById("btn2").onclick = function(){
        alert("点我干嘛2");
    };
</script>
</body>
</html>

        案例：鼠标控制轮播图

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>轮播图</title>
</head>
<body>
<img src="./image/1.jpg" alt="" id="image" width="500px" onmouseenter="stop()" onmouseleave="start()">
<script>
	//定义一个变量，用于存储定时器的id；在清除定时器时要使用
    let timer;
    
    //直接调用一次start方法，页面一打开就开始
    start();

    //开始轮播方法
    function start(){
        let image = document.getElementById("image");
        let filename = 1;
        timer = setInterval(function() {
            if(++filename > 5){
                filename = 1;
            }
            image.src = "./image/" + filename + ".jpg";
        }, 2000);
    }

    //停止轮播方法
    function stop(){
        clearInterval(timer)
    }
</script>
</body>
</html>

5.js对象

        1.Array对象

        js的数组，更加类似于Java的集合，因为js数组的长度可变

        定义数组：

                let 变量名 = new Array(元素1, 元素2, 元素3, ...); 
                let 变量名 = [ 元素1, 元素2, 元素3, ... ]; 

        遍历于存储：

                arr[索引] = 值;
                let v = arr[索引];

常用属性名与方法：     

        

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>js数组</title>
</head>
<body>
    
    <script>
        //1. 定义数组
        //  new Array(元素1,元素2,...)
        let arr1 = new Array("A", 1, true);
        console.log(arr1)
        
        //  [元素1,元素2,...]
        let arr2 = ["B", 2, false];
        console.log(arr2)


        //2. 循环遍历
        let arr = ["A", "B", "C", "D", "E"];
        for (let i = 0; i < arr.length; i++) {
            console.log(arr[i])
        }

        //3. length属性。
        console.log("arr长度：", arr.length); //5
        //  设置数组长度。
        //     如果设置的值小，就截断数组；如果设置的值大，就扩容数组，没有值的元素是undefined
        arr.length = 3;
        console.log("设置arr长度为3后：", arr); // A, B, C

        //4. 常用方法
        //  循环遍历forEach
        arr.forEach(function(value){
            console.log("arr遍历元素值：", value)
        })
        //  尾部添加元素
        arr.push("hello")
        console.log("arr尾部添加元素hello后：", arr); //A, B, C, hello
        //  从索引2开始，删除1个元素
        arr.splice(2, 1)
        console.log("arr删除索引1元素后：", arr) //A, B, hello
    </script>
</body>
</html>

  2.String对象

    定义字符串：

        let 变量名 = new String("hello"); 
        var 变量名 = "hello";

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>js字符串</title>
</head>
<body>
    
    <script>
        //定义字符串：
        let str = " hello, world ";

        console.log("str字符串的长度：", str.length)
        console.log("从str中查找wo：", str.indexOf("wo"))
        console.log(str.trim())
        console.log("从str中截取索引3到索引5的子串：", str.substring(3,5))
    </script>
</body>
</html>

        3.JSON对象【重点】

        JSON对象：JavaScript Object Notation，JavaScript对象标记法，是通过JavaScript标记法书写的文本，通常作为数据传输的格式。        

        json使用场景

        可以作为配置文件的格式。例如我们的讲义所用的typora软件，其配置文件就是json格式的

        可以作为前后台交互的数据载体。前后台交互时，我们需要传输数据，为了方便双方解析数据，可以采用json格式

         

json常用方法：

        

<!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-对象-JSON</title>
</head>
<body>
    
</body>
<script>
    // json格式的字符串  ==> json对象
    let jsonstr = '{"name":"Tom", "age":18, "addr":["北京","上海","西安"]}';
    let obj = JSON.parse(jsonstr);
    console.log(obj.name);

    // json对象  ==> json格式的字符串
    console.log(JSON.stringify(obj));
</script>
</html>

 6.BOM对象

        BOM：Broswer Object Model，浏览器对象模型。BOM对象提供了操作浏览器的方法，我们通过BOM对象可以让浏览器弹窗、切换历史记录等等。

        1.window对象

        window对象是所有bom对象的顶级对象，可以通过window.来获取其它4个bom对象，只是window.通常省略不写

        

        2.location对象

        location是指代浏览器的地址栏对象，常用于获取或者设置浏览器的地址信息：

<html>	
    <head>
        <title>location对象 </title>
    </head>
    <body>
        
        <script>
        	//获取浏览器地址栏信息
            alert(location.href);
            //设置浏览器地址栏信息
            location.href = "https://www.itcast.cn";
        </script>
    </body>
</html>

7.DOM对象        

1.DOM：Document Object Model 文档对象模型。JavaScript 将 HTML 文档的各个组成部分封装为对象，通过这些对象我们可以操作HTML的标签、属性、样式等等。

  • Document：整个文档对象

  • Element：元素对象

  • Attribute：属性对象

  • Text：文本对象

  • Comment：注释对象

2.DOM操作的API 

要想通过DOM操作网页，主要有两个步骤：

  • 想操作哪个标签，就获取哪个标签对象：Element

  • 通过Element对象，操作标签的属性、内容、或样式

操作标签的属性

操作标签的属性很简单，通常是：

  • 获取属性值：let v = 标签对象.属性名

  • 设置属性值：标签对象.属性名 = 值

操作标签的内容

所谓标签的内容，就是开始标签和结束标签中间的部分。例如：<div> 这里是标签的内容 </div>

  • 获取标签内容：let v = 标签对象.innerHTML

  • 设置标签内容：标签对象.innerHTML = "新内容"，会把标签里旧内容覆盖掉

<html>
    <head>
        <title>获取标签</title>
    </head>
    <body>
        帐号：<input type="text" name="username" id="username" class="item"> <br>
        密码：<input type="password" name="password" class="item"> <br>
        性别：<input type="radio" name="gender" value="male">男
             <input type="radio" name="gender" value="female">女 <br>
        
        <script>
        	//根据id获取标签：
            let usernameInput = document.getElementById("username");
            console.log(usernameInput);
            
            //根据tagName获取标签：
            let inputArray = document.getElementsByTagName("input");
            console.log(inputArray);
            
            //根据name属性值获取标签：
            let genderRadios = document.getElementsByName("gender");
            console.log(genderRadios);
            
            //根据class属性值获取标签：
            let items = document.getElementsByClassName("item");
            console.log(items);
        </script>
    </body>
</html>


--------------------
<html>
    <head>
        <title>操作属性</title>
    </head>
    <body>
        <input type="password" id="pwd"> 
        <input type="button" value="查看密码" onmousedown="showPwd()" onmouseup="hidePwd()">
        
        <script>
        	function showPwd(){
                document.getElementById("pwd").type="text";
            }
            function hidePwd(){
                document.getElementById("pwd").type="password";
            }
        </script>
    </body>
</html>


----------------------
<html>
    <head>
        <title>操作标签内容</title>
    </head>
    <body>
        <div id="d1">
            hello
        </div>
        
        <script>
        	let d1 = document.getElementById("d1");
            console.log(d1.innerHTML);
            
            d1.innerHTML = "JavaScript";
        </script>
    </body>
</html>

8.案例全选全消

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
        table {
            width: 500px;
            margin: 0 auto;
            border-collapse: collapse;
        }

        td, th {
            border: 1px solid blue;
            text-align: center;
        }

    </style>
</head>
<body>
<table>
    <tr>
        <th style="width:100px;">
            <input type="checkbox" id="checkall" title="全选/全消" onclick="check()" />
            <input type="button" value="反选" onclick="inverse()">
        </th>
        <th>学号</th>
        <th>姓名</th>
        <th>年龄</th>
    </tr>
    <tr>
        <td>
            <input type="checkbox" class="item"/>
        </td>
        <td>1</td>
        <td></td>
        <td></td>
    </tr>
    <tr>
        <td>
            <input type="checkbox" class="item"/>
        </td>
        <td>2</td>
        <td></td>
        <td></td>
    </tr>
    <tr>
        <td>
            <input type="checkbox" class="item"/>
        </td>
        <td>3</td>
        <td></td>
        <td></td>
    </tr>
    <tr>
        <td>
            <input type="checkbox" class="item"/>
        </td>
        <td>4</td>
        <td></td>
        <td></td>
    </tr>
    <tr>
        <td>
            <input type="checkbox" class="item"/>
        </td>
        <td>5</td>
        <td></td>
        <td></td>
    </tr>
    <tr>
        <td>
            <input type="checkbox" class="item"/>
        </td>
        <td>6</td>
        <td></td>
        <td></td>
    </tr>
</table>

<!--
需求：
    点击checkall的时候，如果checkall是选中状态，设置所有的item都设置为选中状态；
    点击checkall的时候，如果checkall是未选中状态，设置所有的item都设置为未选中状态；
-->
<script>
    function check(){
        //checked是一个true或fasle状态，v是true或false
        //1. 先获取checkall的状态：选中、取消
        let v = document.getElementById("checkall").checked;

        //2. 把checkall的状态设置给所有的item
        let items = document.getElementsByClassName("item");
        for(let i=0; i<items.length; i++){
            items[i].checked = v;
        }
    }

    /**
     * 反选：
     *  思路1：获取所有的item，循环遍历每一个，获取选中状态取反
     *  思路2：获取所有的item，循环遍历每一个，模拟一次点击操作
     */
    function inverse(){
        let items = document.getElementsByClassName("item");
        for(let i=0; i<items.length; i++){
            items[i].checked = !items[i].checked;
        }
    }
</script>
</body>
</html>

  9.JS对象手册

   我们这是学入门和一些常用的属性，很多还是用要查  

        我们可以打开W3school在线学习文档，来到首页，在左侧栏找到浏览器脚本下的JavaScript，如下图所示：

        

                       

        

骚穹
关注
  • 21
    点赞
  • 踩
  • 34
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
javascript
02-10
javascript官方文档，web前端师的权威文档，web前端的
JavaScript 教程 （详细 全面）
热门推荐
梁辰兴的博客
10-31 7万+
JavaScript（简称“JS”）是当前最流行、应用最广泛的客户端脚本语言，用来在网页中添加一些动态效果与交互功能，在 Web 开发领域有着举足轻重的地位。HTML 用来定义网页的内容，例如标题、正文、图像等；CSS 用来控制网页的外观，例如颜色、字体、背景等；JavaScript 用来实时更新网页中的内容，例如从服务器获取数据并更新到网页中，修改某些标签的样式或其中的内容等，可以让网页更加生动。JavaScript 诞生于 1995 年，几乎是和互联网同时出现；
JS（JavaScript）入门指南
分享式获得也是一种学习的态度
06-08 1211
js全程JavaScript，由Netflix开发的客户端脚本语言，不需要编译，可以直接运行。
javascript文档_JavaScript 用法详解
weixin_39913472的博客
11-22 330
HTML 中的脚本必须位于 <script> 与 </script> 标签之间。脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中。<script> 标签如需在 HTML 页面中插入 JavaScript，请使用 <script> 标签。<script> 和 </script> 会...
JavaScript（JS）的简单了解
m0_68989458的博客
08-09 2195
JavaScript（JS）的简单了解
js---javaScript基础知识
A123ppleQueen的博客
07-22 1730
javascript是脚本语言，这门语言可用于html和web。 javascript是一种轻量级的编程语言。 是可以插入html页面的编程代码，插入后，通过浏览器执行。 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <script> doc.
JavaScript学习文档
weixin_44337050的博客
05-04 1997
JavaScript的学习笔记，待补充，我们一起成为前端开发者！
JavaScript详解
weixin_48373085的博客
01-25 2万+
HTML对象，定时器，表单验证，正则表达式
JavaScript看这一篇就够了，简单全面一发入魂
学Java，找哪吒
03-09 3万+
文档对象模型（DOM,Document Object Model）是一个应用编程接口（API），用于在HTML中使用扩展的HTML。DOM将整个页面抽象为一组分层节点。 DOM通过创建表示文档的树，让开发者可以随心所欲的控制网页的内容和结构。使用DOM API可以轻松地删除、添加、替换、修改节点。 对浏览器而言，DOM就是使用ECMAScript实现的，如今已经成为JavaScript语言的一大组成部分。 言而言之，DOM提供与网页内容交互的方法和接口。
JavaScript
爱笑的boy的博客
03-28 3626
JavaScript 1.官方文档 https://www.w3school.com.cn/js/index.asp 2.基本说明 1.JavaScript 能改变 HTML 内容，能改变 HTML 属性，能改变 HTML 样式 (CSS)，能完成页面的数据验证 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</ti
JavaScript基础（超详细全文约一万字）
bguihiub的博客
02-10 8348
回顾整个JavaScript的发展历程, 实际上就是Web发展的历程从最开始的拨号上网方式到现在的100M光纤, 4G/5G移动Web的发展在近20年, 上网的方式发生了翻天复地的变化, 可以说是科技大爆炸.人们在享受越来越便捷的上网的同时, 对Web产品的需求越来越高从单纯的对访问速度的需求, 越来越多的转移到视觉美感, 智能操作交互, 沉浸式虚拟现实, 这些需求又反过来推动了技术的不断创新与进步.
Javascript入门教程.pdf
最新发布
06-21
### JavaScript入门教程知识点详解 #### 一、JavaScript概述 **1.1 JavaScript的地位与作用** JavaScript作为一门脚本语言，在当今互联网技术中占据着举足轻重的位置。无论是你日常浏览的网页还是基于HTML5的应用...
Electron开发文档入门，非常详细全套
05-15
**Electron 开发文档入门详解** Electron 是一个开源框架，它允许开发者使用Web技术（如HTML、CSS和JavaScript）来构建跨平台的桌面应用程序。由于其基于Chromium和Node.js，开发者可以利用Web的便利性和Node.js的...
Javascript培训资料整理分享：Javascript入门指南
02-19
### JavaScript培训资料整理分享：JavaScript入门指南 #### 一、初识JavaScript ##### 1.1 网页三剑客 网页开发中通常提到的“三剑客”包括HTML、CSS以及JavaScript。 - **HTML (HyperText Markup Language)**: ...
jQuery Mobile 快速入门
06-12
### jQuery Mobile 快速入门详解 #### 一、引言 随着移动互联网的快速发展，越来越多的应用和服务需要在各种尺寸的设备上良好运行。为了适应这种趋势，开发人员需要掌握能够跨平台使用的前端框架。jQuery Mobile ...
js 文档学习
qq_36087639的博客
02-11 427
js 文档
【JavaScript】文档注释详解
少莫千华
06-30 8074
在JavaScript中，文档注释是一种特殊的注释格式，用于描述代码的功能、使用方法、参数、返回值等信息。文档注释通常使用特定的注释标记和结构来表示，并且可以通过工具解析生成文档。在JavaScript中，常用的文档注释格式是使用 /** 和 */ 括起来的多行注释。/*** 这是一个示例函数，用于加法运算。* @param {number} a - 第一个操作数* @param {number} b - 第二个操作数* @returns {number} - 两个操作数的和。
前端基础--JavaScript
qq_50048558的博客
08-22 2635
HTML HTML介绍 & 规范 介绍 HTML 指的是超文本标记/标签语言 (Hyper Text Markup Language). 专门制作网页的计算机语言. 超文本的意思是有一些单词或字母，在网页浏览器的世界中被赋予了特殊的权利。 记事本开发第一个网页 <html> <head> <title>第一个网页</title> </head> <body> Hello World! </body>
如何把 jQuery 库的 JavaScript 文件单独写在js文件里，其他html可以导入这个js文件，这个js文件怎么写
05-30
可以将 jQuery 库的 JavaScript 文件单独保存在一个名为 jquery.js 的文件中，然后在 HTML 文件中通过 `<script>` 标签引入这个文件。具体步骤如下： 1.创建一个名为 jquery.js 的文件，将 jQuery 库的 JavaScript 代码复制到这个文件中。 2.在 HTML 文件中，通过 `<script>` 标签引入 jquery.js 文件。可以在 `<head>` 或 `<body>` 标签中插入以下代码： ```html <script src="jquery.js"></script> ``` 3.在 HTML 文件中，通过 `<script>` 标签使用 jQuery 库。例如： ```html <script> $(document).ready(function(){ $("button").click(function(){ $("p").hide(); }); }); </script> ``` 这段代码将在文档加载完成后，为 `<button>` 元素的点击事件添加一个处理程序。当用户点击该按钮时，将隐藏所有 `<p>` 元素。 注意，需要确保在使用 jQuery 库之前，先引入 jquery.js 文件。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值