黑马程序员php培训：javascript+jquery九天课程第七天(1)

[attribute$=value] 选取属性值以value结束 元素集 $('a[href^="mailto:"]').addClass('mailto'); 的所有元素 合 [attribute*=value]
获取不包含class=ho的 <li>元素 $('a[href$=".xsl"]')：获取所有包含href属性，且属性
window.onload()
网页中所有的内容都加载完毕后触发，包括 元素关联的内容（如链接的图片和资源）都 必须下载完毕后触发 同时编写多个，但只能执行最后一个 无
执行个数 简化写法

jQuery对象

jQuery对象和DOM对象之间的转换
1.3 选择器

CSS选择器
选择器 说明
根据id选择元素 根据类名选择元素 根据标记名选择元素 选择所有元素 将每一个选择器匹配的元 素合并后一起返回
$('td:contains("gmail")').addClass('highlight'); //高亮显示email中有gmail的文本 //为表格行绑定事件,使用jQuery的链式语法连续绑定两个事件到同一个对象 素
获取所有不可用的元素 $('.emp tr').mouseover(function() {
[attribute^=value] 选取属性值以value开头
获取id=menu的元素内的所 有<li>子元素 $(‘li[title!=test2]’)：获取所有包含title属性且属性
值不等于test2的<li>元素

黑马程序员JavaEE就业班同步笔记Web前端技术：JavaScript高级1.1案例五：使用JS完成复选框的全选和全不选的效果1.1.1需求：在实际的开发中一条记录一条记录进行删除的话，效率很低，有的时候需要一起删除多条记录.需要通过在表格之前设置一个复选框的形式进行勾选复选框.点击一个删除的按钮.1.1.2分析:1.1.2.1技术分析：1.1.2.2步骤分析：【步骤一】创建一个HTML页面.【步骤二】确定事件：复选框的单击事件.【步骤三】触发一个函数【步骤四】在函数中,获得上面的复选框是否被选中.【步骤五】如果选中,下面的所有的复选框都被选中.【步骤六】如果不选中,下面的所有的复选框都不选中.1.1.3代码实现：function checkAll(){// 获得上面的复选框var selectAll = document.getElementById("selectAll");// 判断这个复选框是否被选中.var ids = document.getElementsByName("ids");if(selectAll.checked == true){// 上面复选框被选中：获得下面所有的复选框,修改checked属性for(var i = 0 ;i<ids.length;i++){ids[i].checked = true;}}else{// 上面复选框没有被选中：获得下面所有的复选框,修改checked属性for(var i = 0 ;i<ids.length;i++){ids[i].checked = false;}}}1.1.4总结：1.1.4.1JS中的DOM对象：【DOM的概述】什么是DOMDOM：Document Object Model：文档对象模型.将一个HTML的文档加载到内存形成一个树形结构,从而操作树形结构就可以改变HTML的样子.DOM的使用：知道document，element，attribute中的属性和方法【DOM的常用的操作】获得元素：* document.getElementById(); -- 通过ID获得元素.* document.getElementsByName(); -- 通过name属性获得元素.* document.getElementsByT agName(); -- 通过标签名获得元素.创建元素：* document.createElement(); -- 创建元素* document.createTextNode(); -- 创建文本添加节点：* element.appendChild(); -- 在最后添加一个节点.* element.insertBefore(); -- 在某个元素之前插入.删除节点：* element.removeChild(); -- 删除元素【使用DOM完成对ul中添加一个li元素】function addElement(){var city = document.getElementById("city");// 创建一个元素:var liEl = document.createElement("li");// 创建一个文本节点:var text = document.createTextNode("深圳");// 添加子节点:liEl.appendChild(text);city.appendChild(liEl);}1.2案例六：使用JS完成省市联动的效果：1.2.1需求：在注册页面上有两个下拉列表,左侧省份的下拉列表一改变,右侧的市的下拉列表也要跟着发生变化.1.2.2分析：1.2.2.1技术分析:【JS中创建数组】【JS的事件】下拉的列表的改变的事件.onchange. 【JS的DOM的操作】创建元素：添加元素：1.2.2.2步骤分析【步骤一】创建一个HTML文件.【步骤二】确定事件：onchange事件.【步骤三】触发函数,在函数中编写代码.【步骤四】获得到所选择的省份的信息.【步骤五】根据选择的省份的信息获得到对应的数组中的市的数据.【步骤六】遍历数组中的市的信息.【步骤七】创建元素，创建文本,最后将元素添加到第二个列表中.1.2.3代码实现:// 定义数组：二维数组：var arrs = new Array(5);arrs[0] = new Array("杭州市","绍兴市","温州市","义乌市","嘉兴市");arrs[1] = new Array("南京市","苏州市","扬州市","无锡市");arrs[2] = new Array("武汉市","襄阳市","荆州市","宜昌市","恩施");arrs[3] = new Array("石家庄市","唐山市","保定市","邢台市","廊坊市");arrs[4] = new Array("长春市","吉林市","四平市","延边市");function changeCity(value){// 获得到选中的省份的信息.var city = document.getElementById("city");// 清除第二个列表中的内容:for(var i=city.options.length;i>0;i--){city.options[i] = null;}// city.options.length = 0;// alert(value);for(var i= 0 ;i< arrs.length;i++){if(value == i){// 获得所有的市的信息.for(var j=0;j<arrs[i].length;j++){// alert(arrs[i][j]);// 创建元素：var opEl = document.createElement("option");// <option></option>// 创建文本节点:var textNode = document.createTextNode(arrs[i][j]);// 将文本的内容添加到option元素中.opEl.appendChild(textNode);// 将option的元素添加到第二个列表中.city.appendChild(opEl);}}}}1.2.4总结：1.2.4.1JS的内置对象:Array:Boolean:Date:* ?time=new Date().getTime(); Math对象:String对象:* charAt();* indexOf();* lastIndexOf();* split();* replace();* substring();* substr();1.2.4.2JS的全局函数：* parseInt();* parseInt(“11”);* parseFloat();* parseFloat(“32.09”);* 编码和解码的方法：// 解码* decodeURI();* decodeURIComponent();// 编码* encodeURI();* encodeURIComponent();eval函数：* 将一段内容当成是JS的代码执行. //var sss = “alert(‘aaaa’)”; //eval(sss);。

PHP学习⿊马视频28天PHP零基础⼊门到精通教程（P1基础6天）笔记1笔记相关信息：标题28天PHP零基础⼊门到精通教程（P1基础6天）视频地址章节P1-P4标签PHP简介动静态⽹站访问流程其他F:\HTML_前端\PHP\B站⿊马BV18x411H7qD\Day01 搭建环境.docxPHP简介什么是PHPPHP定义：⼀种服务器端的 HTML 脚本/编程语⾔,是⼀种简单的、⾯向对象的、解释型的、健壮的、安全的、性能⾮常之⾼的、独⽴于架构的、可移植的、动态的脚本语⾔。

是⼀种⼴泛⽤于 Open Source（开放源代码）的尤其适合 Web 开发并可以嵌⼊ HTML 的多⽤途脚本语⾔。

它的语法接近 C，Java 和 Perl，⽽且容易学习。

该语⾔让 Web 开发⼈员快速的书写动态⽣成的⽹页。

PHP前⾝：Personal HomePage，个⼈主页，使⽤Perl语⾔开发的⼀种写个⼈主页的语⾔PHP：PHP Hypertext Preprosessor，php超⽂本预处理器，底层使⽤C语⾔⽹站Website的中⽂名称是⽹站，是指在互联⽹上，根据⼀定的规则，使⽤HTML、PHP等代码语⾔制作的⽤于展⽰特定内容的相关⽹页的集合，有可供管理⼈员操作的后台及⽤户使⽤的前台。

简单地说，Website是⼀种通讯⼯具，就像布告栏⼀样，⼈们可以通过Website 来发布⾃⼰想要公开的资讯，或者利⽤Website来提供相关的⽹络服务。

⼈们可以通过⽹页浏览器来访问Website，获取⾃⼰需要的资讯或者享受⽹络服务。

静态⽹站特点1.⽹页内容⼀经发布到⽹站服务器上，⽆论是否有⽤户访问，每个静态⽹页的内容都是保存在⽹站服务器上的，也就是说，静态⽹页是实实在在保存在服务器上的⽂件，每个⽹页都是⼀个独⽴的⽂件；2.静态⽹页的内容相对稳定，因此容易被搜索引擎检索；3.静态⽹页没有数据库的⽀持，在⽹站制作和维护⽅⾯⼯作量较⼤，因此当⽹站信息量很⼤时完全依靠静态⽹页制作⽅式⽐较困难；4.静态⽹页的交互性较差，在功能⽅⾯有较⼤的限制。

【黑马程序员】PHP课程同步笔记day10：JS小游戏通过前几周的学习我们对JS有一定的了解，今天的内容就是将之前的学习的内容在小游戏中应用，希望大家能够在小游戏中进一步提升自己的js水平。

JS小游戏：满天都是小星星：代码:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml" xml:lang="zh-cn"><head><meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /><title>满天都是小星星</title><style type="text/css">#span1{border:1px solid red;width:100px;display:inline-block;height:20px;overflow:hidden;}#span2{display:inline-block;height:20px;}</style><script type="text/javascript">var count=0;//代表星星的个数var dingshiqi;//定时器名字var shijian=0;//时间var gametime;//记录游戏时间定时器//设置body的颜色window.onload=init;function init(){//document.body.bgColor="black";}//var dingshiqi=window.setInterval("star()",500);//创建星星的函数function star(){//创建星星var obj=document.createElement("img");obj.src="images/xingxing.gif";//设置星星的宽度var w=Math.floor(Math.random()*(90-30+1))+30;//设置随即位置//var x=e.clientX;//鼠标的x坐标//var y=e.clientY;//鼠标的y坐标var x=Math.floor(Math.random()*1300)+30;var y=Math.floor(Math.random()*500)+30;obj.style.position="absolute";obj.style.top=y+"px";obj.style.left=x+"px";//把obj加到body中document.body.appendChild(obj);//给对象绑定事件obj.onclick=removestar;//记录星星个数count++;//调用函数告诉玩家有多少个星星countxingxing();//改变进度条document.getElementById("span2").style.width=count*5+"px";document.getElementById("span2").style.backgroundColor="red"; }//删除星星的函数function removestar(){this.parentNode.removeChild(this);count--;countxingxing();}//点击开始游戏的函数function startxingxing(){dingshiqi=window.setInterval("star()",500);gametime=window.setInterval("youxishijian()",1000); }//暂停游戏function zanting(){alert("暂停游戏");}//星星个数function countxingxing(){var shu=document.getElementById("count");if(count>20){alert("游戏结束");window.clearInterval(dingshiqi);window.clearInterval(gametime);}shu.innerHTML=count+"个星星";}//记录游戏时间function youxishijian(){var obj=document.getElementById("jishi");shijian++;obj.innerHTML="游戏进行"+shijian+"秒";}</script></head><body><span id="count">0个星星</span><input type="button" value="点击开始游戏" onclick="startxingxing()"> <input type="button" value="点击暂停游戏" onclick="zanting()"><span id="jishi">游戏进行0秒</span><span id="span1"><span id="span2"></span></span></body></html>实现效果：点我啊小游戏：代码：<!DOCTYPE html><html><head><meta http-equiv="content-type" content="text/html" charset="utf-8"> <title>小游戏</title><script type="text/javascript">var number=1;function mv(){if (number==1){mv2();number=2;}else if(number==2){mv3();number=3;}else if(number==3){mv4();number=4;}else if(number==4){mv1();number=1;}}function mv1(){document.getElementById('d1').style.left=0+"%";document.getElementById('d1').style.right=88+"%";document.getElementById('d1').style.top=0+"%";document.getElementById('d1').style.bottom=76+"%";function mv2(){document.getElementById('d1').style.left=88+"%";document.getElementById('d1').style.right=0+"%";document.getElementById('d1').style.top=0+"%";document.getElementById('d1').style.bottom=76+"%"; }function mv3(){document.getElementById('d1').style.top=76+"%";document.getElementById('d1').style.bottom=0+"%";document.getElementById('d1').style.left=88+"%";document.getElementById('d1').style.right=0+"%";}function mv4(){document.getElementById('d1').style.bottom=0+"%";document.getElementById('d1').style.left=0+"%";document.getElementById('d1').style.top=76+"%";document.getElementById('d1').style.right=88+"%";</script><style type="text/css">#d1{width: 160px;height:160px;background-color: #66ffff;border: 2px solid yellow;border-radius:10px 10px 10px 10px ;box-shadow: 2px 2px 10px #cccccc;position: absolute;top: 0%;left: 0%;right:86%;bottom:86%;}#input{margin-top:45px;margin-left: 30px;width: 101px;height: 68px;background-color: #66ffff;color: #ffffff;font-weight: 700;border: 0px;}</style></head><body><div id="d1" ><input id="input" type="button" value="来呀，点我呀！" onmouseover="mv()"/></div></body></html>效果：黑马程序员济南中心编著。