首頁 >後端開發 >php教程 >PHP求職寶典系列－PHP Web 程式設計篇

PHP求職寶典系列－PHP Web 程式設計篇

WBOY原創: 2016-08-08 09:22:311644瀏覽

PHP Web 程式設計篇

form表單

　〜1.TPOST T 方法提交的表單資料被附加到URL 上，並作為URL 的一部分傳送到伺服器端。 URL 的長度應限制在 1MB 字元以內。

POST 方法不依賴 URL，不會將傳遞的參數值顯示在網址列中。另外，POST 方法可以沒有任何限制的傳遞資料到伺服器，所有提交的資訊在後台傳輸，使用者在瀏覽器端是看不到的，安全性高。
2.如何透過form表單控制上傳檔案的大小？

enctype="multipart/form-data",指定表單編碼資料的方式。

method="post",指定資料的傳輸方式。
,
（單位值不能超過位元組php.ini 設定檔upload_max_filesize 選項設定的值。 3.如何設定form表單中的唯讀屬性？

利用 readonly 設定指定內容的唯讀屬性；

利用使用
利用使用的屬性

　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檔案也可以說是一個文字文件，它包含一些CSS標記，CSS檔案必須使用.css為後綴。
透過CSS檔案實現內容與表現形式的分離，可以改變網頁的整體表現形式，使維護網站的外觀更加容易，使HTML瀏覽程式碼更加簡練，縮短瀏覽器的載入時間。

　　2.在HTML頁中插入CSS樣式的幾種方式？

在HTML頁中的標記下定義一對標記，在標記內部利用標籤名稱、類別選擇符、id選擇符設定屬性。
在標籤內部定義style 屬性，然後定義本標籤下的樣式，如：

創建.css樣式檔案

，在檔案內部利用選項符號或類別選取符號等樣式符號，然後在檔案內顯示的HTp利用標籤引入文件

3.CSS樣式常用屬性：

定義邊框的屬性可以設定邊框的寬度、顏色、顏色、c 字體的裝飾，如下劃線、閃爍等line-height檢索或設定物件的行高，即字體最底端與字體內部頂端之間的距離letter-spacingtext-align

4.如何解決以下程式碼在IE6 下的雙倍邊距問題？

<span><span><style type="text/css">
body </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></style></span></span>

　　這是 IE6 下的常見 Bug，雖然定義的外邊距為10px，但是 IE 卻解析為20px。

　　解決方案：新增屬性 display:inline

5.如何解決超連結點擊後 hover 樣式不出現的問題？

對超連結樣式屬性進行正確的排序即可。

a:link{color:red;text-docoration:none}

: a:hover{color:black;text-decoration:overline}

a:action{color:black;text-decoration:overline}

文字無法撐開容器的高度問題？

添加兩個CSS屬性，min-width和

min-height

，也可以加入一個清除對齊方式的類clear:divboth 屬性的瀏覽器的計算狐。

7.怎麼定義1px 左右高度的容器？

　　在網頁佈局的過程中，導航欄和內容欄之間往往需要一個隔間，一般情況下設定 1 個像素的高度為最佳。

DIV 標籤

＜

和標記同樣作用於網頁版面中，它們的不同之處在於：
span標記是屬於內聯的，一般用於小模組的樣式內聯到HTML文檔中

div 元素本身就是塊級元素，多用於組合大塊的程式碼
2.如何使一個DIV層居中定位？

position:absolute;

3.如何解決filefox 瀏覽器中巢狀div 標籤text-align 屬性失效的問題?

<span>1</span><span><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></style>
</span><span>5</span><span><div>
</span><span>6</span><span><div></div>
</span><span>7</span><span></div></span>

JavaScript 腳本1.

　　彈出對話框使用alert()函數　　取得輸入焦點使用

focus()

函數 2. JavaScript 的轉向函數是什麼？怎麼引入一個外部JavaScript檔案？

　　轉向函數：

window.location.href="檔案名稱";

　〜typesJava 字碼>

3.當滑鼠劃過文字框，自動選取文字方塊中的內容：

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

　　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> ?>

輸出，要求寫出HTML和JavaScript程式碼：

　　前台頁面設計的程式碼如下：　　後台判斷生肖的PHP腳本：

<span> 1</span><span><</span><span>html</span><span>></span><span> 2</span><span><</span><span>head</span><span>></span><span> 3</span><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><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><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><span>body</span><span>></span><span> 8</span><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><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><span>11</span><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>

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><span>var</span> title=$("<span>苹果</span>"<span>);
</span><span>5</span> $("div").append(title);<span>//</span><span>将title追加到div标签内容的后面</span><span>6</span> $("div").before(title);<span>//</span><span>将title追加到div标签之前与div标签属于同一层次</span><span>7</span> $("div").prepend(title);<span>//</span><span>将title追加到div标签内容之前</span><span>8</span> $("div").after(title);<span>//</span><span>将title追加到div标签之后与div标签属于同一层次</span><span>9</span> </script>

4.如何在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><span>var</span> title=$("<span>苹果</span>"<span>);
</span><span>5</span> $("div"<span>).replaceWith(title);
</span><span>6</span> </script>

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

<span>1</span> <script type="text/javascript" src="jquery-1.4.2.js"></script>
<span>2</span> <img src="color.jpg">
<span>3</span> <script>
<span>4</span> $("img".click(<span>function</span><span>(){
</span><span>5</span>     $(<span>this</span>).fadeOut("slow"<span>);
</span><span>6</span><span>});
</span><span>7</span> </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</span> $("input").click(d=<span>function</span><span>(){
</span><span>4</span>         $(<span>this</span>).slideUp("slow"<span>);
</span><span>5</span><span>});
</span><span>6</span> </script>

　　7.照片轮换效果：

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

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

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

CSS樣式的常用屬性
屬性名稱	解析
border	定義邊框的屬性可以設定邊框的寬度、顏色、border
background-image	設定背景圖片
font-size	設定字體大小
font-familydealration

的文字之間的間隔
設定或擷取物件中文字的對齊方式

陳述：

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

上一篇：shopnc b2b2c如何開啟偽靜態？？下一篇：shopnc b2b2c如何開啟偽靜態？？

看更多

PHP求職寶典系列－PHP Web 程式設計篇

相關文章