Loading [MathJax]/jax/output/CommonHTML/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >引入JS文件和JQuery

引入JS文件和JQuery

作者头像
鹤川
发布于 2023-03-21 13:44:40
发布于 2023-03-21 13:44:40
6.4K00
代码可运行
举报
文章被收录于专栏:鹤川博客鹤川博客
运行总次数:0
代码可运行

引入JS文件和JQuery

引入.js文件

  • JS的代码可以写在单独的.js文件中
  • 通过 的方式引入
  • 引入之后的使用方式和在html中直接写js脚本是一样的功能

jQuery

  • jQuery是一个轻量级的框架,一个单独的js文件,大部分网站和web应用都会使用
  • 选择器功能,非常强大
  • Ajax异步请求后端,非常强大
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<scripttype="text/javascript"src="./jquery-1.11.3.min.js"></script>

一、代码实战

代码的详细解读,可以参考视频教程。

新建 html 文件 22-jQuery.html ,编写下方程序,运行看看效果吧

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<!DOCTYPE html>
<htmllang="en">
    <head>
        <metacharset="UTF-8">
        <metahttp-equiv="X-UA-Compatible"content="IE=edge">
        <metaname="viewport"content="width=device-width, initial-scale=1.0">
        <scriptsrc="./jquery-1.11.3.min.js"></script>
        <title>jQuery</title>
    </head>
  
    <body>
        <inputid="mytext"type="text"/>
        <buttononclick="getValue()">获取输入框内容</button>

        <scripttype="text/javascript">
            function getValue(){
                // let value = document.getElementById('mytext').value
                let value = $('#mytext').val()
                alert(value)
            }
        </script>
    </body>
</html>
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2023 年 02 月,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
window和document
window和document 都是网页中的JavaScript对象。 window对象:就是这个浏览器的窗口,可以通过window获取宽度、高度、网页跳转 document对象:可以通过函数获取网页中标签,然后通过js操作标签 代码实战 新建 html 文件 20-window.html,编写下方程序,运行看看效果吧 <!DOCTYPE html> <htmllang="en"> <head> <metacharset="UTF-8"> <metahttp-equi
鹤川
2023/03/21
5980
Javascript的应用
新建 HTML 文件 28-JS.html ,编写下方程序,用浏览器运行看看效果吧。
鹤川
2023/03/21
1810
setTimeout和setInterval
新建 html 文件 21-setTimeout.html ,编写下方程序,运行看看效果吧
鹤川
2023/03/21
1.1K0
body和head标签
新建 html 文件 04-body-head.html ,编写下方程序,运行看看效果吧
鹤川
2023/03/21
8390
按钮 button
新建 html 文件 12-button.html,编写下方程序,运行看看效果吧。
鹤川
2023/03/21
2.1K0
input标签
input标签 网页中的输入框。 一、语法介绍 <form> <inputtype="text"name="username"value="qicong"/> </form> 标签 <input> ,主要用于页面数据的填写,然后将数据提交到服务器端。比如我们最长使用的 用户名、密码 ,就是 input 输入框完成的 主要写在 form 标签中,通过 form 提交将数据提交到后台 属性 name:我们提交数据的时候,后台根据 name 来取前端传过去的数据 属性 value:就是用户填写的数据 属性 ty
鹤川
2023/03/21
1.3K0
jQuery的安装
jQuery的安装 一、如何在网页中引入jQuery 在html页面中引入jQuery的js文件即可 &lt;!-- &#x76F8;&#x5BF9;&#x8DEF;&#x5F84; --&gt; &lt;scripttype=&quot;text/javascript&quot;src=&quot;./res/jquery-1.11.3.min.js&quot;&gt;&lt;/script&gt; jQuery 在页面加载完成时执行 $(document).ready(function(){
鹤川
2023/04/27
2330
JQuery jquerysessionjs插件使用介绍
https://gitee.com/ishouke/front_end_plugin/blob/master/jquery-3.2.1.min.js
授客
2019/08/21
2.5K0
select标签
选择框<select>标签:主要用于数据的选择,比如说我们常常在一些网站上填写:省份、城市、地区的时候,使用的就是select
鹤川
2023/03/21
1.2K0
2.3.2 基于bootstrap框架写加法器
    什么是bootstrap?一套用js和CSS编写的框架模板,自己组装一下就可以编写比较美观的网页。官当介绍是组件库:
周星星9527
2018/08/07
7580
2.3.2 基于bootstrap框架写加法器
认识CSS
Html主要用于页面的内容展示,JavaScript主要用于页面元素之间的逻辑处理,Css主要是修饰的作用,比如颜色、位置、大小、效果等等。
鹤川
2023/03/21
1880
alert和confirm
新建 html 文件 19-alert.html ,编写下方程序,运行看看效果吧。
鹤川
2023/03/21
2.1K0
WEB入门之十九 UI
jQuery本身注重于​​后台​​,没有漂亮的界面,而jQuery UI的出现则补充了前者的不足,它提供了诸多的组件和华丽的界面,使用方便、灵活。
张哥编程
2024/12/17
2950
超链接 a 标签
主要用于打开其他网页,其中非常重要的属性是 href 属性,对应的值是其他网页的链接
鹤川
2023/03/21
1.7K0
input:checkbox标签
新建 html 文件 16-checkbox.html ,编写下方程序,运行看看效果吧
鹤川
2023/03/21
1.1K0
input:文件选择和隐藏
新建 html 文件 17-inputFile.html,编写下方程序,运行看看效果吧
鹤川
2023/03/21
1.5K0
html中的标签
标签 也可以叫 元素。所以我们常说:html标签 或 html元素,比如 <body> 标签。
鹤川
2023/03/21
5.6K0
学习jQuery?这篇文章就够了
jQuery 使用户能更方便地处理 HTML(标准通用标记语言下的一个应用)、events、实现动画效果,并且方便地为网站提供 AJAX 交互。 jQuery 的语法设计可以使开发者更加便捷,例如操作文档对象、选择 DOM 元素、制作动画效果、事件处理、使用 AJAX 以及其他功能。
上分如喝水
2021/08/16
12.4K0
认识html
HTML的英文全称是 Hyper Text Markup Language,即超文本标记语言。我们在浏览器中打开的页面都是html页面,里面的内容都是html的标签构成的
鹤川
2023/03/21
1970
html中的注释
新建 html 文件 03-comment.html ,编写下方程序,运行看看效果吧
鹤川
2023/03/21
4.3K0
相关推荐
window和document
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验