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


      PHP Web 编程篇

      form表单

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


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

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

    • enctype="multipart/form-data",指定表单编码数据的方式。
    • method="post",指定数据的传输方式。
    • <input type="hidden" name="MAX_FILE_SIZE" 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文档代码更加简练,缩短浏览器的加载时间。

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

    • 在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样式常用属性:

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

     

     

      

     

      

     

      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>    
    View Code

      后台判断生肖的PHP脚本:

    1 <?php
    2 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,由美国人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树中创建并插入元素?

    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="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;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>   

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

    ——无厘果果·原创出品
  • 相关阅读:
    微信小程序配置域名的时候提示“校验文件验证失败”
    微信小程序封装mixins方法
    nuxt中报window is not defined
    nuxt中iview按需加载配置
    nuxt 项目安装及环境配置
    使用指针遍历图像
    图像添加噪声(椒盐噪声)
    Java中基本知识梳理【定时器实现多线程】-----2015年3月15日
    Java基础知识---【静态成员,封装性,包】------2015年3月6日
    Java中基本知识梳理【基本变量的处理】-----2015年3月6日
  • 原文地址:https://www.cnblogs.com/JennyZhang-sharing/p/4459170.html
Copyright © 2020-2023  润新知