wordpress代码执行,网站运营优化培训,开源cms建站系统,wordpress社交链接设置JQuery是对JavaScript的封装#xff0c;简化了JS代码#xff0c;是主流框架的基础(VUE,EasyUI,Bootstrap) 它是2006年推出的JQuery的优势#xff1a; 体积小#xff0c;压缩后只有100KB左右 强大的选择器 出色的DOM封装 可靠的事件处理机制 出色的浏览器兼容性 使用隐式迭代…JQuery是对JavaScript的封装简化了JS代码是主流框架的基础(VUE,EasyUI,Bootstrap) 它是2006年推出的JQuery的优势 体积小压缩后只有100KB左右 强大的选择器 出色的DOM封装 可靠的事件处理机制 出色的浏览器兼容性 使用隐式迭代简化编程 丰富的插件支持 引入Jquery库 script srcjs/jquery-3.4.1.js typetext/javascript/scriptJQuery加载页面触发 script typetext/javascript /*js代码*/ window.οnlοadfunction(){ alert(js加载一); }; /*jquery代码*/ $(document).ready(function(){ alert(Jquery加载一); }); jQuery(document).ready(function(){ alert(Jquery加载二); }); /*对Jquery加载上面两种方式的简写*/ $(function(){ alert(Jquery加载三); }); /scriptwindow.onload和$(document).ready区别 window.onload只能有一个没有简写方式必须等待页面所有资源加载完毕之后才能触发 $(document).ready可有多个简介为$(function(){//代码})等待页面上所有文档结构html标签记载完后触发JQuery设置样式 script typetext/javascript /*操作样式addClass()方法*/ $(function(){ //其实上就是动态的给标签加了一个class属性 /* $(#whtdiv).addClass(wht); */ //单个设置css /* $(#lldiv).css(color,yellow); //设置多个 $(#lldiv).css({border:1px solid blue,background-color:pink}); //链式方式 $(#whtdiv).css(color,green).css(border,1px solid blue); */ //下一个元素 $(#whtdiv).css(color,green).next().css(color,pink).next().css(color,orange); }); /script JQuery常用方法和事件详情请见W3C $(function(){ /*给显示图片按钮注册一个click事件*/ $(#show).click(function(){ $(#imgs).slideDown(3000); }); $(#hide).click(function(){ $(#imgs).slideUp(3000); }); }); ---------------------------------------- $(function(){ $(li).mouseover(function(){ //不能用$(li) $(this).css(color,blue); }).mouseout(function(){ $(this).css(color,black); }); }); JQuery对象和Dom对象的相互转换 script typetext/javascript $(function(){ /*js获取dom对象*/ /* var domdocument.getElementById(wht5); */ /* alert(dom.innerHTML); */ /* alert(dom.innerText); */ /* 获取value属性值*/ /* alert(dom.value); */ /*jquery对象*/ /* var $jdom$(#wht5); */ /* alert(jdom.html()); */ /* alert(jdom.text()); */ /* 一般用于表单*/ /* alert($jdom.val()); */ /*Dom对象转换Jquery对象*/ var domdocument.getElementById(wht); var $jdom$(dom); $jdom.html(); /*jquery转dom对象*/ var $jdom$(#wht5); var dom$jdom[0]; /* var dom$jdom.get(0); */ alert(dom.value); }); /script转载于:https://www.cnblogs.com/Chencheno/p/11009408.html
