jquery绑定事件的方式
1.直接使用事件函数
&("div").click(function(){ alert(1) })
复制
2.用统一的on函数绑定事件
on(事件类型,事件函数)
$("div").on("click",function(){ alert(2) })
复制
事件类型以参数的类型传递 --->可以同时绑定多个事件 ,用空格隔开(只支持JavaScript原生的方法,hover不行(jQuery自己封装的))
var aa="click dblclick mouseenter" $("div").on(aa,function(){ alert(2) })
复制
3.用on函数给未来元素绑定事件
on(事件类型,目标元素,事件函数)
事件类型以参数的类型传递 --->可以同时绑定多个事件 ,用空格隔开(只支持JavaScript原生的方法,hover不行(jQuery自己封装的))
$("body").on("click","h1",function(){ alert(1) }) $("input").click(function(){ $("div").after("<h1>添加元素</h1>") })
复制
<style> div{ width: 400px; height: 300px; background-color: red; font-size: 15px; } </style> </head> <body> <div> <h4 id="aa">aaa</h4> <a href="#" class="aa">sdfas</a> <p>aasjda</p> <button>点击</button> <input type="button" value="生成元素"> </div> </body>
复制
dom和jdom
javascript---->dom
jquery---->jdom
dom <----->jdom相互转换
dom--->jdom $(dom)
jdom ---->dom jdom[0]
eg.jdom
console.log($("input").eq(0)) $("input").click(function(){ alert(1) })
复制
如果有很多input, eq(0)找到下标为0的第一个input(用eq指定)
eg.dom
$("input")[0].onclick=function(){ alert(1) }
复制
或者用querySelector直接找到对象
JQuery-AJAX
如果用html原生的<form>表单的形式对网页进行提交,会对所有的进行更新。
若要实现局部的更新,用AJAX来实现
AJAX = 异步 JavaScript 和 XML(Asynchronous JavaScript and XML)。
ajax是系统直接发起的,所以不需要找具体的元素。
$.ajax({ })
复制
$.ajax({ url:"json/eg16.json",//请求路径 type:"get",//请求方式 get post data:{},//参数域 success:function(value){//data|value) 成功之后的回调函数 console.log(value) console.log(value.sites) }, error:function(){//失败之后的回调函数 } })
复制
success里的data|value是形参。
请求最好发到后台。
在前台的话,引json文件。
看json代码符不符合,在json在线解析里检查。