首页  >  文章  >  后端开发  >  PHP求职宝典系列——PHP Web 编程篇

PHP求职宝典系列——PHP Web 编程篇

WBOY
WBOY原创
2016-08-08 09:22:311572浏览

PHP Web 编程篇

form表单

  1.简述 POST 和 GET 传输的最大容量分别是多少?


  • GET 方法提交的表单数据被附加到 URL 上,并作为URL 的一部分发送到服务器端。 URL 的长度应限制在 1MB 字符以内。
  • POST 方法不依赖于 URL,不会将传递的参数值显示在地址栏中。另外,POST 方法可以没有任何限制的传递数据到服务器,所有提交的信息在后台传输,用户在浏览器端是看不到的,安全性高。

2.如何通过form表单控制上传文件的大小?

  • enctype="multipart/form-data",指定表单编码数据的方式。
  • method="post",指定数据的传输方式。
  • ,通过隐藏域控制上传文件的大小(单位为字节),该值不能超过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文档代码更加简练,缩短浏览器的加载时间。

  2.在HTML页面中插入CSS样式的几种方式?

  • 在HTML页面中的标记下定义一对标记,在标记内部利用标签名称、类选择符、id选择符设置属性。
  • 在标签内部定义 style 属性,然后定义本标签下的样式,如:

链接

  • 创建.css样式文件,在文件内部利用id选择符或类选择符等定义样式,然后在显示的HTNL主页面中利用标签引入文件。如:

3.CSS样式常用属性:

CSS样式的常用属性
属性名称 解析
border 定义边框的属性可以设置边框的宽度、颜色、样式
background-color 设置背景颜色
background-image 设置背景图像
font-size 设置字体大小
font-family 设置字体
text-decoration 检索或设置对象中文本的装饰,如下划线、闪烁等
line-height 检索或设置对象的行高,即字体最底端与字体内部顶端之间的距离
letter-spacing 检索或设置对象中的文字之间的间隔
text-align 设置或检索对象中文本的对齐方式

 

 


 

 

4.如何解决以下代码在 IE6 下的双倍边距问题?

<span><span><style type="text/css">
body </style></span>{<span>margin</span>:<span>0</span>;}<span>div  </span>{<span>float</span>:<span>left</span>;  <span>margin-left</span>:<span>10px</span>;<span>    width</span>:<span>200px</span>;<span>    height</span>:<span>200px</span>;  <span>border</span>:<span>1px</span>;<span>    solid red;</span>}<span></span></span>

  这是 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-widthmin-height,也可以加入一个清除对齐方式的类 clear:both 属性的 div 来自动计算火狐浏览器的高度。

7.怎样定义1px 左右高度的容器?

  在网页布局的过程中,导航栏和内容栏之间往往需要一个隔断,一般情况下设置 1 个像素的高度为最佳。


 DIV 标签

1.标签

的区别:

  

标记同样作用于网页布局中,它们的不同之处在于:
  • span标记是属于内联的,一般用于小模块的样式内联到HTML文档中
  • div 元素本身就是块级元素,多用于组合大块的代码

2.如何使一个DIV层居中定位?

position:absolute;

top:50%;

left:50%;

margin:-100px 0 0 -100px;

3.怎样解决 filefox 浏览器中嵌套 div 标签 text-align 属性失效的问题?

<span>1</span><span><style>
</style></span><span>2</span><span>.one </span>{<span>border</span>:<span>1px solid blue</span>;<span>width</span>:<span>300px</span>;<span>height</span>:<span>200px</span>;<span>text-align</span>:<span>center </span>}
<span>3</span><span>.two </span>{<span>border</span>:<span>1 px solid blue</span>;<span>width</span>:<span>200px</span>;<span>height</span>:<span>100px</span>;<span>margin</span>:<span>0px auto </span>}
<span>4</span><span>
</span><span>5</span><span><div>
<span>6</span><span><div></div>
</span><span>7</span><span></span>
</div></span>

JavaScript 脚本

1.弹出对话框的函数和获得输入焦点函数:

  弹出对话框使用alert()函数

  获取输入焦点使用 focus()函数

2. JavaScript 的转向函数是什么?怎么引入一个外部JavaScript文件?

  转向函数: window.location.href="文件名称";

  引入外部 JavaScript 文件:

3.当鼠标划过文本框,自动选中文本框中的内容:

 4

5.设置主页的 JavaScript 代码:

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 $(<span>function<span>() {
 5       $("input:last".click(<span>function<span>() {
 6             $.get ("in.php",<span> {
 7                     username:$("input:first").<span>val()
 8             },<span>function<span>(data) {
 9<span>                     alert (data);
 10             })'<span> 11        });
 12 });
 13 </script>

  in.php 页面代码如下:

<span> 1</span> <span>php
</span><span> 2</span><span>$string</span>="明日科技"<span>;
</span><span> 3</span><span>if</span>(<span>isset</span><span>($ GET[username])) {
</span><span> 4</span><span>if</span>(<span>urldecode</span>($ GET[username])==<span>$string</span><span>) {
</span><span> 5</span><span>echo</span> "用户名被占用"<span>;
</span><span> 6</span>     }<span>else</span><span>{
</span><span> 7</span><span>echo</span> "用户名可用"<span>;
</span><span> 8</span><span>    }
</span><span> 9</span><span>}
</span><span>10</span> ?>

 2. 编写代码,使得在文本框中输入一个年份,判断其生肖,并在文本框旁边输出,要求写出HTML和JavaScript代码:

  前台页面设计的代码如下:

<span> 1</span><span><span>html</span><span>></span><span> 2</span><span><span>head</span><span>></span><span> 3</span><span><span>meta </span><span>http-equiv</span><span>="Content-type"</span><span> content</span><span>="text/html;charset="</span><span>UTF-8""</span><span>></span><span> 4</span><span><span>script </span><span>type</span><span>="text/javascript"</span><span> src</span><span>="jequery-1.4.2.js"</span><span>></span><span>script</span><span>></span><span> 5</span><span><span>title</span><span>></span>生肖的自动选择<span></span><span>title</span><span>></span><span> 6</span><span></span><span>head</span><span>></span><span> 7</span><span><span>body</span><span>></span><span> 8</span><span><span>input </span><span>type</span><span>="text"</span><span> value</span><span>="请输入年份格式为2015"</span><span> onclick</span><span>="this.select()"</span><span>></span><span> 9</span><span><span>input </span><span>type</span><span>="submit"</span><span> value</span><span>="判断"</span><span>></span><span>10</span><span><span>span</span><span>></span><span>span</span><span>></span><span>11</span><span><span>script</span><span>></span><span>12</span><span>    $(</span><span>function</span><span>(){
</span><span>13</span><span>        $(</span><span>"</span><span>input:last</span><span>"</span><span>).click(</span><span>function</span><span>(){
</span><span>14</span><span>            $.get(</span><span>"</span><span>in.php</span><span>"</span><span>,{
</span><span>15</span><span>                number:$(</span><span>"</span><span>input:first</span><span>"</span><span>).val()
</span><span>16</span><span>            },</span><span>function</span><span>(data){
</span><span>17</span><span>                    $(</span><span>"</span><span>span</span><span>"</span><span>).text(data);
</span><span>18</span><span>            });
</span><span>19</span><span>        });
</span><span>20</span><span>});
</span><span>21</span><span></span><span>script</span><span>></span><span>22</span><span></span><span>body</span><span>></span><span>23</span><span></span><span>html</span><span>></span></span></span></span></span></span></span></span></span></span></span>
View Code

  后台判断生肖的PHP脚本:

<span>1</span> <span>php
</span><span>2</span><span>if</span>(<span>isset</span>(<span>$_GET</span>[<span>number</span><span>])){
</span><span>3</span><span>$array</span>=<span>array</span>("猪","鼠","牛","虎","兔","龙","蛇","马","羊","猴","鸡","狗"<span>);
</span><span>4</span><span>foreach</span>(<span>$array</span><span>as</span><span>$key</span>=><span>$value</span><span>) {
</span><span>5</span><span>if</span>(<span>ceil</span>(<span>$_GET</span>[<span>number</span>]%12)==<span>$key</span><span>){
</span><span>6</span><span>echo</span><span>$value</span><span>;
</span><span>7</span><span>                 }
</span><span>8</span><span>        }
</span><span>9</span> }

jQuery框架

  目前比较流行的客户端脚本语言框架jQuery,由美国人John Resig创建,是优秀的JavaScript框架,其宗旨是write less,do more.它是轻量级的js库,兼容CSS3,兼容各种浏览器(IE 6.0+)。用户能更方便地处理HTML document、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树中创建并插入元素?

<span>1</span> <script type="text/javascript" src="jquery-1.4.2.js"></script>
<span>2</span> <div>水果</div>
<span>3</span> <script>
<span>4<span>var title=$("<span>苹果"<span>);
<span>5 $("div").append(title);<span>//<span>将title追加到div标签内容的后面<span>6 $("div").before(title);<span>//<span>将title追加到div标签之前与div标签属于同一层次<span>7 $("div").prepend(title);<span>//<span>将title追加到div标签内容之前<span>8 $("div").after(title);<span>//<span>将title追加到div标签之后与div标签属于同一层次<span>9 </script>

4.如何在DOM树中替换指定元素?

<span>1</span> <script type="text/javascript" src="jquery-1.4.2.js">
<span>2 <div>水果</script>
3 <script> <span>4<span>var title=$("<span>苹果"<span>); <span>5 $("div"<span>).replaceWith(title); <span>6 </script>

  5.将一张图片以淡出的效果消失在页面中:

<span>1</span> <script type="text/javascript" src="jquery-1.4.2.js"></script>
<span>2</span> <img  src="color.jpg" alt="PHP求职宝典系列——PHP Web 编程篇" >
<span>3</span> <script>
<span>4 $("img".click(<span>function<span>(){
<span>5     $(<span>this).fadeOut("slow"<span>);
<span>6<span>});
<span>7 </script>

  6.制作一个按钮,当按钮被单击时以卷帘效果消失:

<span>1</span> <script type="text/javascript" src="jquery-1.4.2.js"></script>
<span>2</span> <input type="button" value="按钮"><script>
<span>3 $("input").click(d=<span>function<span>(){
<span>4         $(<span>this).slideUp("slow"<span>);
<span>5<span>});
<span>6 </script>

  7.照片轮换效果:

<span> 1</span> <script type="text/javascript" src="jquery-1.4.2.js"></script>
<span> 2</span> <style>
<span> 3 ul{list-<span>style:none;width:350px;height:200px;position:absolute}
<span> 4<span>li{position:ansolute}
<span> 5 </style>
<span> 6</span> <div>
<span> 7</span> <ul>
<span> 8</span> <li><img  ssrc="1.jpg"    style="max-width:90%" height="200px" alt="PHP求职宝典系列——PHP Web 编程篇" ></li>
<span> 9</span> <li><img  ssrc="2.jpg"    style="max-width:90%" height="200px" alt="PHP求职宝典系列——PHP Web 编程篇" ></li>
<span>10</span> <li><img  ssrc="3.jpg"    style="max-width:90%" height="200px" alt="PHP求职宝典系列——PHP Web 编程篇" ></li>
<span>11</span> <li><img  ssrc="4.jpg"    style="max-width:90%" height="200px" alt="PHP求职宝典系列——PHP Web 编程篇" ></li>
<span>12</span> </ul>
<span>13</span> </div>
<span>14</span> <script>
<span>15 $(<span>function<span>(){
<span>16     $(."change ul li:not(:first)"<span>).hide();
<span>17     setInterval(<span>function<span>(){
<span>18<span>if($."change ul li:last").is(":visible"<span>)){
<span>19             $(."change ul li:first").fadeIn("slow"<span>);
<span>20             $(."change ul li:last"<span>).hide();
<span>21     }<span>else<span>{
<span>22             $(."change ul li:visible").next().fadeIn("slow"<span>);
<span>23<span>    }
<span>24   },1000<span>);
<span>25<span>});
<span>26 </script>   

鉴于最近要准备各种期末考和大作业,发博时间明显减少,劳烦多多理解啊!本篇都是利用零碎时间编辑的,现在大功告成还是挺满足啦,若您觉得有帮助,可以随手点个赞。

以上就介绍了PHP求职宝典系列——PHP Web 编程篇,包括了方面的内容,希望对PHP教程有兴趣的朋友有所帮助。

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn