PHP Web 编程篇
form表单
1.简述 POST 和 GET 传输的最大容量分别是多少?
2.如何通过form表单控制上传文件的大小?
enctype='multipart/form-data',指定表单编码数据的方式。 method='post',指定数据的传输方式。 <input type='hidden' name='MAX_FILE_SIZE' html' target='_blank'>value='10000' />,通过隐藏域控制上传文件的大小(单位为字节),该值不能超过php.ini 配置文件upload_max_filesize 选项设置的值。3.如何设置form表单中的只读属性?
利用 readonly 设置指定内容的只读属性; 利用 disabled 实现设置指定内容的只读属性。4.在什么情况下,$name 与 $_POST['name']可以通用?
在 php.ini 文件中 register_globals = On 时, $name 与 $_POST['name']都可以获取form表单中表单元素name的值(以post方式提交)。
但是不建议开启register_globals全部变量,因为会给程序带来安全隐患。
CSS 样式
1.CSS 的含义是什么?
CSS (Cascading Style Sheet,译为'层叠样式表' 或 '级联样式表') 语言是一种标记语言,不需要解释,可以直接由浏览器解释执行(属于浏览器解释型语言),实现控制Web页面的外观。它是W3C协会为弥补HTML在显示属性设定上的不足而指定的一套扩展样式标准。
其作用如下:
在标准网页设计中CSS负责网页内容(XHTML)的表现。 CSS文件也可以说是一个文本文件,它包含一些CSS标记,CSS文件必须使用.css为后缀。 通过CSS文件实现内容与表现形式的分离,可以改变网页的整体表现形式,使维护站点的外观更加容易,使HTML文档代码更加简练,缩短浏览器的加载时间。在HTML页面中的<head></head>标记下定义一对<style></style>标记,在标记内部利用标签名称、类选择符、id选择符设置属性。 在标签内部定义 style 属性,然后定义本标签下的样式,如:<a href='#' style='border:0'>链接</a>
创建.css样式文件,在文件内部利用id选择符或类选择符等定义样式,然后在显示的HTNL主页面中利用<link>标签引入文件。如:<link type='text/css' rel='stylesheet' href='路径'>
3.CSS样式常用属性:
4.如何解决以下代码在 IE6 下的双倍边距问题?
<style type='text/css'>body {margin:0;}div {float:left; margin-left:10px; width:200px; height:200px; border:1px; solid red;}</style>
这是 IE6 下的常见 Bug,虽然定义的外边距为10px,但是 IE 却解析为20px。
解决方案:添加属性 display:inline
5.如何解决超链接被点击后 hover 样式不出现的问题?
对超链接样式属性进行正确的排序即可。
a:link{color:red;text-docoration:none}
a:visited{color:blue;text-decoration:none}
a:hover{color:black;text-decoration:overline}
a:action{color:black;text-decoration:overline}
6.如何解决火狐浏览器下文本无法撑开容器的高度问题?
添加两个CSS属性,min-width 和 min-height ,也可以加入一个清除对齐方式的类 clear:both 属性的 div 来自动计算火狐浏览器的高度。
7.怎样定义1px 左右高度的容器?
在网页布局的过程中,导航栏和内容栏之间往往需要一个隔断,一般情况下设置 1 个像素的高度为最佳。
DIV 标签
1.标签<span>和<div>的区别:
<div>和<span>标记同样作用于网页布局中,它们的不同之处在于:
span标记是属于内联的,一般用于小模块的样式内联到HTML文档中 div 元素本身就是块级元素,多用于组合大块的代码2.如何使一个DIV层居中定位?
position:absolute;
top:50%;
left:50%;
margin:-100px 0 0 -100px;
3.怎样解决 filefox 浏览器中嵌套 div 标签 text-align 属性失效的问题?
1 <style>2 .one {border:1px solid blue;width:300px;height:200px;text-align:center }3 .two {border:1 px solid blue;width:200px;height:100px;margin:0px auto }4 </style>5 <div class='one'>6 <div class='two'></div>7 </div>
JavaScript 脚本
1.弹出对话框的函数和获得输入焦点函数:
弹出对话框使用 alert()函数
获取输入焦点使用 focus()函数
2. JavaScript 的转向函数是什么?怎么引入一个外部JavaScript文件?
转向函数: window.location.href='文件名称';
引入外部 JavaScript 文件:<script type='text/javascript src='文件路径及名称''></script>
3.当鼠标划过文本框,自动选中文本框中的内容:
<input id='txt' type='text' value='baidu' onmouseover='this.select()'/>
4
<input id='txt' type='text' value='baidu' onclick='this.value=' ''/>
5.设置主页的 JavaScript 代码:
<a href='#' onclick='this.style.behavior='url(#default#homepage)'; this.setHomepage ('url');'>设为首页</a>
Ajax 应用
1.利用 jQuery中的Ajax判断用户名是否被占用:
需要定义两个页面,index.php 页面代码如下:
1 <script type='text/javascript' src='jquery-1.4.2.js'></script> 2 <input type='text' ><input type='button' value='校验'> 3 <script type='text/javascript'> 4 $(function() { 5 $('input:last'.click(function() { 6 $.get ('in.php', { 7 username:$('input:first').val() 8 },function(data) { 9 alert (data); 10 })' 11 }); 12 }); 13 </script>
in.php 页面代码如下:
1 <?php 2 $string='明日科技'; 3 if(isset($ GET[username])) { 4 if(urldecode($ GET[username])==$string) { 5 echo '用户名被占用'; 6 }else{ 7 echo '用户名可用'; 8 } 9 }10 ?>
2. 编写代码,使得在文本框中输入一个年份,判断其生肖,并在文本框旁边输出,要求写出HTML和JavaScript代码:
前台页面设计的代码如下:
1 <html> 2 <head> 3 <meta http-equiv='Content-type' content='text/html;charset='UTF-8''> 4 <script type='text/javascript' src='jequery-1.4.2.js'></script> 5 <title>生肖的自动选择</title> 6 </head> 7 <body> 8 <input type='text' value='请输入年份格式为2015' onclick='this.select()'> 9 <input type='submit' value='判断'>10 <span></span>11 <script>12 $(function(){13 $('input:last').click(function(){14 $.get('in.php',{15 number:$('input:first').val()16 },function(data){17 $('span').text(data);18 });19 });20 });21 </script>22 </body>23 </html>
后台判断生肖的PHP脚本:
1 <?php2 if(isset($_GET[number])){3 $array=array('猪','鼠','牛','虎','兔','龙','蛇','马','羊','猴','鸡','狗');4 foreach($array as $key=>$value) {5 if(ceil($_GET[number]%12)==$key){6 echo $value;7 }8 }9 }
jQuery框架
目前比较流行的客户端脚本语言框架jQuery,由美国人JohnResig创建,是优秀的JavaScript框架,其宗旨是write less,do more.它是轻量级的js库,兼容CSS3,兼容各种浏览器(IE 6.0+)。用户能更方便地处理HTMLdocument、events,实现动画效果,并且可以方便地为网站提供AJAX交互。jQuery另一个比较大的优势是,它的文档说明很全,而且各种应用也说的很详细,同时还有许多成熟的插件可供选择。jQuery能够使用户的HTML页保持代码和HTML内容的分离,也就是说,不用再在HTML里面插入一堆js来调用命令了,只需定义id即可。
1.jQuery中常用选择器:
基本选择器:
id选择器:只能用一次
class选择器:允许重复使用
标签选择器
*:匹配所有元素
层次选择器:
$('#a.b')选取id值为a的元素里所有class值为b的元素。
$('#a>.b')选取id值为a的元素后的class值为b的子元素。
$('#a+.b')选取id值为a的元素后紧挨的class值为b的元素。
过滤选择器:
:first,选取第一个元素。
:odd,选取索引是奇数的元素。
:even,选取索引是偶数的元素。
:not,选取除某元素外的其他元素。
:eq(),按索引寻找元素。
:lt(),小于某索引值的元素。
:gt,大于某索引值的元素。
2.如何实现查找DOM树中的元素?
var input = $('input:first');
3.如何在DOM树中创建并插入元素?
1 <script type='text/javascript' src='jquery-1.4.2.js'></script>2 <div>水果</div>3 <script>4 var title=$('<span>苹果</span>');5 $('div').append(title);//将title追加到div标签内容的后面6 $('div').before(title);//将title追加到div标签之前与div标签属于同一层次7 $('div').prepend(title);//将title追加到div标签内容之前8 $('div').after(title);//将title追加到div标签之后与div标签属于同一层次9 </script>
4.如何在DOM树中替换指定元素?
1 <script type='text/javascript' src='jquery-1.4.2.js'</script>2 <div>水果</div>3 <script>4 var title=$('<span>苹果</span>');5 $('div').replaceWith(title);6 </script>
5.将一张图片以淡出的效果消失在页面中:
1 <script type='text/javascript' src='jquery-1.4.2.js'></script>2 <img src='color.jpg'>3 <script>4 $('img'.click(function(){5 $(this).fadeOut('slow');6 });7 </script>
6.制作一个按钮,当按钮被单击时以卷帘效果消失:
1 <script type='text/javascript' src='jquery-1.4.2.js'></script>2 <input type='button' value='按钮' style='width:200px;height:200px;'><script>3 $('input').click(d=function(){4 $(this).slideUp('slow');5 });6 </script>
7.照片轮换效果:
1 <script type='text/javascript' src='jquery-1.4.2.js'></script> 2 <style> 3 ul{list-style:none;width:350px;height:200px;position:absolute} 4 li{position:ansolute} 5 </style> 6 <div class='change'> 7 <ul> 8 <li><img ssrc='1.jpg' width=350px height=200px></li> 9 <li><img ssrc='2.jpg' width=350px height=200px></li>10 <li><img ssrc='3.jpg' width=350px height=200px></li>11 <li><img ssrc='4.jpg' width=350px height=200px></li>12 </ul>13 </div>14 <script>15 $(function(){16 $(.'change ul li:not(:first)').hide();17 setInterval(function(){18 if($.'change ul li:last').is(':visible')){19 $(.'change ul li:first').fadeIn('slow');20 $(.'change ul li:last').hide();21 }else{22 $(.'change ul li:visible').next().fadeIn('slow');23 }24 },1000);25 });26 </script>
鉴于最近要准备各种期末考和大作业,发博时间明显减少,劳烦多多理解啊!本篇都是利用零碎时间编辑的,现在大功告成还是挺满足啦,若您觉得有帮助,可以随手点个赞。
PHP编程郑重声明:本文版权归原作者所有,转载文章仅为传播更多信息之目的,如作者信息标记有误,请第一时间联系我们修改或删除,多谢。
新闻热点
疑难解答