网页加载的不同的方式、点击按钮显示一句话、jQuery中获取元素的方法

网页加载的不同的方式

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title><script src="jquery-1.12.1.js"></script><script>// 点击按钮,显示一句话// $("#btn").click(function(){//     console.log('小苏好帅哦');// });// 没有页面加载的事件// 注册事件----赋值的// DOM中页面加载事件----页面全部加载完毕才触发(标签,文字,图片,引入的文件)// window.onload = function(){//   console.log('小苏好帅');// };// window.onload = function(){//   console.log('哈哈,我又变帅了');// };// jQuery的代码// 页面加载事件// jQuery中第一种页面加载事件// $(window).load(function(){//   console.log('小苏好猥琐哦');// });// $(window).load(function(){//   console.log('哈哈,小杨好帅哦');// });// jQuery中第二种页面加载的事件----比上面的快----页面中的基本的元素加载后// 就触发了// $(document).ready(function(){//     console.log(1);// });// $(document).ready(function(){//     console.log(2);// });// jQuery中第三种页面加载的事件----页面中基本的元素加载后就触发了// jQuery(function(){//   console.log('页面加载了1');// });// jQuery(function(){//   console.log('页面加载了2');// });// $(document).ready(function(){//     console.log(1);// });// $(document).ready(function(){//     console.log(2);// });$(function(){console.log('页面加载了1');});$(function(){console.log('页面加载了2');});// function f1(){// }// f1();// f1();</script>
</head>
<body>
<input type="button" value="显示效果" id="btn"><script>// document.getElementById('btn').onclick = function(){//   console.log(1);// };// document.getElementById('btn').onclick = function(){//   console.log(2);// };// var num = 10;// var num = 100;// console.log(num);
</script>
</body>
</html>

点击按钮显示一句话

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title><script src="jquery-1.12.1.js"></script><script>// 页面加载的事件$(function(){// 根据id获取按钮,添加点击事件$("#btn").click(function(){console.log('哈哈,真的好帅');});});</script>
</head>
<body>
<input type="button" value="显示效果" id="btn"></body>
</html>

jQuery中获取元素的方法

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Document</title><script src="jquery-1.12.1.js"></script><script>// DOM作用:操作页面的元素/*** DOM中获取元素的方式:**  根据id获取元素*  document.getElementById('id属性的值');*  根据标签名字获取元素*  document.getElementsByTagName('标签名字');*  根据name属性获取元素*  document.getElementsByName('name属性的值');*  根据类样式名字获取元素*  document.getElementsByClassName('类样式的名字');*  根据选择器获取元素*  document.querySelector('选择器');---->id选择器,类选择器,标签选择器...*  一个的*  document.querySelectorAll('选择器');多个的*  *//*** jQuery中获取元素的方式:** $("选择器")----jQuery对象*/</script>
</head>
<body></body>
</html>

网页加载的不同的方式、点击按钮显示一句话、jQuery中获取元素的方法相关推荐

在网页加载完毕时，自动触发某个按钮的点击事件（HTML）
在网页加载完毕时自动触发某个按钮的点击事件需求: 在使用bootstrap 模态框时,需要模态框在网页加载完毕后,自动显示模态框,而不是通过按钮激活模态框. 解决思路: 在window.onload ...
网页加载卡通人物cavas方式实现
步骤一:复制以下内容到web项目此处要放在根目录下,即域名可以直接带上路径可以访问的地方步骤二:在head和foot里面加上如下的代码: 附件下载地址: 链接:https://pan.baidu. ...
jquery中获取元素的几种方式小结
1 从集合中通过指定的序号获取元素 <div>0123& ...
2345王牌浏览器网页加载慢怎么办网页加载慢解决
2345王牌浏览器网页加载慢怎么办?相信很多2345王牌浏览器用户都碰到过这个问题,今天小编就给大家带来这个解决办法,让你拥有极速加载网页. 2345王牌浏览器网页加载慢解决办法 1.打开清除上网痕迹 ...
Chrome现在也能编辑pdf文件了！64位安卓版上线，网页加载快10%，还有良心标签管理功能...
贾浩楠发自凹非寺量子位报道 | 公众号 QbitAI 全世界最多人在用的Chrome浏览器,今天更新了. 版本号:Chrome 85. 增加一系列标签管理功能,还自带PDF编辑器,并且提升10 ...
用 Flask 来写个轻博客 (28) — 使用 Flask-Assets 压缩 CSS/JS 提升网页加载速度
Blog 项目源码:https://github.com/JmilkFan/JmilkFan-s-Blog 目录目录前文列表扩展阅读 Flask-Assets 将 Flask-Assets 应用 ...
分享网页加载速度优化的一些技巧？
日期:2013-2-17 来源:GBin1.com 不管你是不是相信,在最近的几年里,互联网网页的大小已经显著增大了.由HTTP Archive研究得出的结果表明,目前平均一个页面的大小是1.25M ...
关于前端性能优化问题，认识网页加载过程和防抖节流
前端性能优化-网页加载过程.性能优化方法.防抖和节流一.网页加载过程 1.加载资源的形式 2.加载资源的过程 3.渲染页面的过程 4.关于window.onload 和 DOMContentLoad ...
CEF3—在网页加载前给js对象填值
文章目录 CEF3-在网页加载前给js对象填值前言思路代码 CEF3-在网页加载前给js对象填值前言记录一次笔者在实际开发中遇到的问题.在用cef做多页应用开发的时候,多个单页共享数据的问题 ...

网页加载的不同的方式、点击按钮显示一句话、jQuery中获取元素的方法

网页加载的不同的方式、点击按钮显示一句话、jQuery中获取元素的方法相关推荐

最新文章

热门文章