发表于: 2018-09-10 20:26:13
1 791
今天完成的事情
看了一点jquery内容
Window - 浏览器对象模型(BOM)
明天计划的事情
还是继续看知识点吧,任务完全不知道怎么开始
遇到的问题
任务二下面涉及到的知识点
断点调试
正则表达式
看不懂
收获
一.jquery
1.jquery的引用<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
2.语法
固定文档就绪函数写法
$(document).ready(function(){
});
基础语法是:$(selector).action()
$(document).ready(function(){
$("button").click(function(){
});
});
3.jQuery 选择器
(1)元素选择器
$("p") 选取 <p> 元素。
$("p.intro") 选取所有class="intro"的<p>元素。
$("p#demo") 选取所有 id="demo" 的 <p> 元素。
(2)属性选择器
$("[href]") 选取所有带有 href 属性的元素。
$("[href='#']") 选取所有带有 href 值等于 "#" 的元素。
$("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。
$("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。
(3)CSS 选择器
$("p").css("background-color","red");
例子把所有 p 元素的背景颜色更改为红色:
4.jquery可直接给元素添加事件
<script >
$(document).ready(function(){
$("button").click(function(){
$("p").hide();
});
});
</script>
6.jQuery 效果
(1)hide() 方法来隐藏 HTML 元素:
show()方法来显示 HTML 元素:
toggle() 方法来切换 hide() 和 show() 方法。
语法$(selector).hide(speed,callback);
$(selector).show(speed,callback);
可选的 speed 参数规定隐藏/显示的速度,可以取以下值:"slow"、"fast" 或毫秒。
可选的 callback 参数是隐藏或显示完成后所执行的函数名称
(2)fadeIn() 用于淡入已隐藏的元素。
fadeOut() 方法用于淡出可见元素。
fadeToggle() 方法可以在 fadeIn() 与 fadeOut() 方法之间进行切换。
fadeTo() 方法允许渐变为给定的不透明度(值介于 0 与 1 之间)。
二.Window - 浏览器对象模型(BOM)
1.window浏览器窗口
window.innerHeight - 浏览器窗口的内部高度
window.innerWidth - 浏览器窗口的内部宽度
2.screen屏幕的信息。
screen.availWidth - 可用的屏幕宽度
screen.availHeight - 可用的屏幕高
3.window.location 对象用于获得当前页面的地址 (URL),并把浏览器重定向到新的页面
location.hostname 返回 web 主机的域名
location.pathname 返回当前页面的路径和文件名
location.port 返回 web 主机的端口 (80 或 443)
location.protocol 返回所使用的 web 协议(http:// 或 https://)
Window Location Href,location.href 属性返回当前页面的 URL。
location.assign() 加载新的文档。
<script>
function newDoc()
{
window.location.assign("http://www.w3school.com.cn")
}
</script>
</head>
<body>
<input type="button" value="加载新文档" onclick="newDoc()">
评论