一、jquery入门

礼乐之星

已于 2023-03-02 22:43:19 修改

阅读量79

点赞数

分类专栏： jquery 文章标签： jquery javascript 前端

于 2023-03-02 22:25:04 首次发布

本文链接：https://blog.csdn.net/itliyue/article/details/129310270

版权

jquery 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

1、引入jquery.js

<script src="/static/myapp/jquery.min.js"></script>

2、简单使用：

首先在html中写script标签，注意成对！

<scrip>
		# 这是jquery的主体函数
	    $(function(){
           
        })
		# 在主体函数中可以进行 定义变量、点击事件等操作
        $(function(){
            var dic = {
                "name":"张三",
                "sex":"男",
                "age":18
            }
            $("#content").html(dic['name'])

            $("#btn_1").click(function(){
                $("#content").html(dic['name'])
            })

            $("#btn_4").click(function(){
                $("#content").hide()
            })
            $("#btn_5").click(function(){
                $("#content").show()
            })

            $("#btn_6").click(function(){
                let number01 = $("#number_1").val()
                let number02 = $("#number_2").val()
                let result = number01 * number02
                $("#number_3").val(result)
            })
            
        })
</scrip>

<script>
    $(function(){
        $("#btn_7").click(function (){
            # 发送ajax请求
            $.ajax({
                url:"/show_pwd/",
                type:"get",
                success:function(result){
                    $("#pwd").html(result)
                }
            })
        })
    })
</script>

3、常见操作

$(“#content”).html(‘content’) # 通过获取id 修改div标签的内容
$(“#content”).hide() # 通过获取id隐藏div标签的内容
$(“#content”).show() # 通过获取id显示div标签的内容
$(“#btn_1”).click() # 通过获取id 触发按钮点击操作
$(“#val”).val() #通过获取id 获取input 输入框的值
$(“#number_3”).val(result) # 通过获取id修改input 输入框的值

alert() # 弹出框
console.log() # 控制台打印