JavaScript基础——JavaScript调用的三种方式

news2024/9/23 7:32:26

JavaScript简介

JavaScript的作用

JavaScript的使用方式

内嵌JS

引入外部js文件

编写函数


JavaScript简介

        JavaScript(简称“JS”)是一种具有函数优先的轻量级,解释型或即时编译型的编程语言。它是Web开发中最常用的脚本语言之一,通常用于创建动态网页,允许用户与网页进行交互。JavaScript最初由Brendan Eich在1995年为Netscape Navigator浏览器设计,现在已经成为几乎所有现代浏览器的标准组成部分。

JavaScript的作用

        JavaScript作为一种功能强大的编程语言,它在现代Web开发中扮演着至关重要的角色。它不仅能够实现用户与界面之间的丰富交互,如开关按钮、下拉菜单、轮播图、列表渲染以及条件渲染等,提供用户友好和动态的网页体验,而且还能够通过Ajax技术处理数据的前后端交互,实现无需重新加载页面即可更新内容的功能。此外,JavaScript的Node.js平台允许开发者搭建Web服务并处理后端业务逻辑,例如用户登录、注册、找回密码、发送邮件验证以及数据的持久化存储等。这些能力使得JavaScript成为了构建全栈Web应用程序不可或缺的工具,从前端的交互逻辑到后端的服务搭建,JavaScript都能提供强大的支持和灵活的解决方案。

        可以实现用户与界面交互的逻辑(开关、下拉菜单、轮播图、列表渲染、条件渲染、滚动加载等)

        可以处理数据的前后端交互 ajax (网络请求)

        可以搭建web服务、处理后端的业务逻辑 nodejs (登录、注册、找回密码、发送邮件验证、数据持久化)

JavaScript的使用方式

        一个JavaScript可以有三种使用方式:内嵌、外部引入、编写函数。

内嵌JS

        使用<script>标签将JavaScript代码直接嵌入HTML页面中。

        内嵌JavaScript的优点包括:

  1. 简单快捷:对于简单的交互和功能,可以直接在HTML文件中编写和测试JavaScript代码。
  2. 易于理解:对于初学者来说,将JavaScript代码和HTML元素放在一起可以更容易地理解它们之间的关系。

        然而,内嵌JavaScript也有一些缺点:

  1. 维护困难:随着代码量的增加,内嵌JavaScript可能会使HTML文件变得难以维护。
  2. 性能问题:如果JavaScript代码在每个页面加载时都重复,可能会影响页面的加载速度。
  3. 安全性问题:直接在HTML中编写JavaScript代码可能会增加跨站脚本攻击(XSS)的风险。写成一段话

引入外部js文件

        外部JavaScript文件是一种将JavaScript代码与HTML文档分离的方法,这样做可以提高代码的可维护性、可重用性和安全性。

        首先,创建.js扩展名的文件。例如,你可以创建一个名为helloworld.js的文件。

        然后,在这个.js文件中编写JavaScript代码,并在html文件中引入.js文件。

 

编写函数

        使用function关键字来定义一个函数。函数可以有参数(也称为形参),这些参数用于接收传递给函数的数据。

 

        定义函数后,可以通过函数名和一对圆括号来调用它。如果函数有参数,需要在圆括号内传递相应的参数。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1964370.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

高清无水印,录屏软件对比盘点

现在生活中不论是想要记录赛事精彩瞬间、制作教学视频&#xff0c;都可以用录屏大师这样的录屏软件来实现。今天我就介绍几款备受好评的录屏工具。 1.福昕录屏大师 链接直达&#xff1a;https://www.foxitsoftware.cn/REC/ 这个软件就是一个专业的录屏工具。它可以控制屏幕…

UltraEdit v27文本代码程序编辑器免费版下载安装教程(亲测可用)

前言 UltraEdit 是一套功能强大的文本编辑器&#xff0c;可以编辑文本、十六进制、ASCII 码&#xff0c;完全可以取代记事本&#xff08;如果电脑配置足够强大&#xff09;&#xff0c;内建英文单字检查、C 及 VB 指令突显&#xff0c;可同时编辑多个文件&#xff0c;而且即使…

OrangePi AI Pro 固件升级 —— 让主频从 1.0 GHz 到 1.6 GHz 的巨大升级

前言 OrangePi AI Pro 最近发布了Ascend310B-firmware 固件包&#xff0c;据说升级之后可以将 CPU 主频从 1.0 GHz 提升至 1.6 GHz&#xff0c;据群主大大说&#xff0c;算力也从原本的 8T 提升到了 12T&#xff0c;这波开发板的成长让我非常的 Amazing 啊&#xff01;下面就来…

【学习日记】U-Boot 环境变量与 U-Boot 命令概述

本文记录了在学习 i.MX6ULL 的 U-Boot 代码时关于环境变量和 U-Boot 命令的一些关键点。 1 环境变量的定义 在 U-Boot 中&#xff0c;使用 #define 和反斜杠 \ 来定义多行字符串。 反斜杠 \&#xff1a; 反斜杠用于指示宏定义在下一行继续。这意味着所有的行将被视为一个连续的…

mqtt协议详解(0)初步认识mqtt

文章目录 1. 介绍2. 主要特性3. 架构1. 介绍 MQTT(Message Queuing Telemetry Transport,消息队列遥测传输协议)是一种构建在TCP/IP协议之上的轻量级、基于发布-订阅模式的消息传输协议,适用于资源受限的设备和低带宽、高延迟或不稳定的网络环境,例如IOT。 MQTT 协议于 1…

JVM:栈上的数据存储

文章目录 一、Java虚拟机中的基本数据类型 一、Java虚拟机中的基本数据类型 在Java中有8大基本数据类型&#xff1a; 这里的内存占用&#xff0c;指的是堆上或者数组中内存分配的空间大小&#xff0c;栈上的实现更加复杂。 Java中的8大数据类型在虚拟机中的实现&#xff1a;…

【error】ModuleNotFoundError: No module named ‘mmcv.cnn.weight_init‘

from&#xff1a; oduleNotFoundError: No module named ‘mmcv.cnn.weight_init‘_modulenotfounderror: no module named mmcv.cnn-CSDN博客https://blog.csdn.net/qq_36679208/article/details/107815137?spm1001.2101.3001.6650.1&utm_mediumdistribute.pc_relevant.…

java基础 之 集合与栈的使用(二)

文章目录 List 和 Set的比较Set接口对于set的无序该怎么理解&#xff1f;&#xff08;一&#xff09;实现类&#xff1a;HashSet&#xff08;二&#xff09;实现类&#xff1a;LinkedHashSet【代码部分】HashSet 和 LinkedHashSet浅谈HashSet 和 LinkedHashSet的打印结果 &…

MYSQL-初级-事务篇

目录 概述为什么有事务&#xff1f; 事务操作事务的四大特性&#xff08;AICD&#xff09;原子性&#xff08;Atomicity&#xff09;一致性&#xff08;Consistency&#xff09;隔离性&#xff08;Isolation&#xff09;持久性&#xff08;Durability&#xff09; 并发事务问题…

为虚幻引擎C++项目设置VS开发环境

为虚幻引擎C项目设置VS开发环境 虚幻引擎&#xff08;简称UE&#xff09; 能与 Visual Studio&#xff08;简称VS&#xff09; 完美结合&#xff0c;使你能够快速、简单地改写项目代码&#xff0c;并能即刻查看编译结果。设置Visual Studio以使用虚幻引擎能提高开发者对虚幻引…

rust 桌面 sip 软电话(基于tauri 、pjsip库)

本文尝试下rust 的tauri 桌面运用 原因在于体积小 1、pjsip 提供了rust 接口官方的 rust demo 没编译出来 在git找了个sip-phone-rs-master https://github.com/Charles-Schleich/sip-phone-rs 可以自己编译下pjsip lib库替换该项目的lib 2、创建一个tauri demo 引用 [depe…

操作系统(4)——文件系统

目录 小程一言文件系统管理基础概念&功能基本概念文件的结构和属性文件的操作文件的安全性和权限控制文件系统的实现和分配方式 问题&解答1、文件系统在操作系统中起到什么作用&#xff1f;2、文件的逻辑结构和物理结构有何区别&#xff1f;3、如何理解文件权限控制在操…

时间序列异常值检验替换——基于Hampel滤波器

Hampel滤波器作为一种强大的时间序列异常值处理工具&#xff0c;在数据清洗和分析中发挥着重要作用。本文将深入研究Hampel滤波器的原理和数学推导&#xff0c;并通过实际代码演示其在异常值处理中的应用 1. Hampel滤波器简介 1.1 什么是Hampel滤波器&#xff1f; Hampel滤波…

【达梦数据库】通过线程pid定位会话SQL

【达梦数据库】通过线程pid定位会话SQL 1、查找数据库进程 ps -ef|grep dmserver2、通过进程pid去找对应的线程 top -H -p $pid -------------------- top命令经常用来监控linux的系统状况&#xff0c;是常用的性能分析工具&#xff0c;能够实时显示系统中各个进程的资源占用…

Signac包-1.Analyzing PBMC scATAC-seq

–https://stuartlab.org/signac/articles/pbmc_vignette 好的&#xff0c;开始学习scATAC-seq的数据是怎么玩的了&#xff0c;先跑完Signac的教程&#xff0c;边跑边思考怎么跟自己的课题相结合。 留意更多内容&#xff0c;欢迎关注微信公众号&#xff1a;组学之心 数据和R…

Qt安卓开发的一些概念

目录 1、Android 版本和 API 的对应关系&#xff1f; 2、ABI是什么 2.1、x86_64 2.2、x86 2.3、arm64-v8a 2.4、armeabi-v7a 3、不同架构的特点 3.1、32位 ARM 架构 (ARMv7) 3.2、64位 ARM 架构 (ARMv8-A) 3.3、32位 Intel 架构 (x86) 3.4、64位 Intel 架构 (x86-64…

vue+element-ui的列表查询条件/筛选条件太多以下拉选择方式动态添加条件(支持全选、反选、清空)

1、此功能已集成到TQueryCondition组件中 2、最终效果 3、具体源码(新增moreChoose.vue) <template><el-popoverpopper-class"t_query_condition_more":bind"popoverAttrsBind"ref"popover"v-if"allcheckList.length>0"…

本地VSCode连接远程linux环境服务器的docker

目录 1、安装远程SSH 2、连接远程主机 3、远程中安装docker 4、查看容器 &#xff08;1&#xff09;直接查看容器和镜像 &#xff08;2&#xff09;使用命令查看 最近在新服务器中执行程序&#xff0c;要用到远程的docker。但是命令行环境下查看代码非常不方便&#xff0…

upload-labs 1-19关 攻略 附带项目下载地址 小白也能看会

本文章提供的工具、教程、学习路线等均为原创或互联网收集&#xff0c;旨在提高网络安全技术水平为目的&#xff0c;只做技术研究&#xff0c;谨遵守国家相关法律法规&#xff0c;请勿用于违法用途&#xff0c;如有侵权请联系小编处理。 环境准备&#xff1a; 1.靶场搭建 下…

Nsight System and Nsight Compute 性能分析工具

Nsight System 系统级别去分析性能&#xff0c;也就是宏观方向。 Achieved Accupacy低&#xff1a;在Nsight System pipline可以直接看出来 kernel launch 延迟&#xff1a;cpu发起gpu执行kernel过程中&#xff0c;有个kernel launch环节&#xff0c;grid block。优化方法&a…