php经典分页
php
程式碼
分頁
開源
經典
程式設計
程式設計語言
軟體開發
<span style="color: #000000">php
</span><span style="color: #0000ff">class</span><span style="color: #000000"> PageView{
</span><span style="color: #008000">/*</span><span style="color: #008000">*页码*</span><span style="color: #008000">*/</span>
<span style="color: #0000ff">public</span> <span style="color: #800080">$pageNo</span> = 1<span style="color: #000000">;
</span><span style="color: #008000">/*</span><span style="color: #008000">*页大小*</span><span style="color: #008000">*/</span>
<span style="color: #0000ff">public</span> <span style="color: #800080">$pageSize</span> = 20<span style="color: #000000">;
</span><span style="color: #008000">/*</span><span style="color: #008000">*共多少页*</span><span style="color: #008000">*/</span>
<span style="color: #0000ff">public</span> <span style="color: #800080">$pageCount</span> = 0<span style="color: #000000">;
</span><span style="color: #008000">/*</span><span style="color: #008000">*总记录数*</span><span style="color: #008000">*/</span>
<span style="color: #0000ff">public</span> <span style="color: #800080">$totalNum</span> = 0<span style="color: #000000">;
</span><span style="color: #008000">/*</span><span style="color: #008000">*偏移量,当前页起始行*</span><span style="color: #008000">*/</span>
<span style="color: #0000ff">public</span> <span style="color: #800080">$offSet</span> = 0<span style="color: #000000">;
</span><span style="color: #008000">/*</span><span style="color: #008000">*每页数据*</span><span style="color: #008000">*/</span>
<span style="color: #0000ff">public</span> <span style="color: #800080">$pageData</span> = <span style="color: #0000ff">array</span><span style="color: #000000">();
</span><span style="color: #008000">/*</span><span style="color: #008000">*是否有上一页*</span><span style="color: #008000">*/</span>
<span style="color: #0000ff">public</span> <span style="color: #800080">$hasPrePage</span> = <span style="color: #0000ff">true</span><span style="color: #000000">;
</span><span style="color: #008000">/*</span><span style="color: #008000">*是否有下一页*</span><span style="color: #008000">*/</span>
<span style="color: #0000ff">public</span> <span style="color: #800080">$hasNextPage</span> = <span style="color: #0000ff">true</span><span style="color: #000000">;
</span><span style="color: #0000ff">public</span> <span style="color: #800080">$pageNoList</span> = <span style="color: #0000ff">array</span><span style="color: #000000">();
</span><span style="color: #0000ff">public</span> <span style="color: #800080">$jsFunction</span> ='jsFunction'<span style="color: #000000">;
</span><span style="color: #008000">/*</span><span style="color: #008000">*
*
* @param unknown_type $count 总行数
* @param unknown_type $size 分页大小
* @param unknown_type $string
</span><span style="color: #008000">*/</span>
<span style="color: #0000ff">public</span> <span style="color: #0000ff">function</span> __construct(<span style="color: #800080">$count</span>=0, <span style="color: #800080">$size</span>=20,<span style="color: #800080">$pageNo</span>=1,<span style="color: #800080">$pageData</span> =<span style="color: #0000ff">array</span>(),<span style="color: #800080">$jsFunction</span>='jsFunction'<span style="color: #000000">){
</span><span style="color: #800080">$this</span>->totalNum = <span style="color: #800080">$count</span>;<span style="color: #008000">//</span><span style="color: #008000">总记录数</span>
<span style="color: #800080">$this</span>->pageSize = <span style="color: #800080">$size</span>;<span style="color: #008000">//</span><span style="color: #008000">每页大小</span>
<span style="color: #800080">$this</span>->pageNo = <span style="color: #800080">$pageNo</span><span style="color: #000000">;
</span><span style="color: #008000">//</span><span style="color: #008000">计算总页数</span>
<span style="color: #800080">$this</span>->pageCount = <span style="color: #008080">ceil</span>(<span style="color: #800080">$this</span>->totalNum/<span style="color: #800080">$this</span>-><span style="color: #000000">pageSize);
</span><span style="color: #800080">$this</span>->pageCount = (<span style="color: #800080">$this</span>->pageCount$this-><span style="color: #000000">pageCount;
</span><span style="color: #008000">//</span><span style="color: #008000">检查pageNo</span>
<span style="color: #800080">$this</span>->pageNo = <span style="color: #800080">$this</span>->pageNo == 0 ? 1 : <span style="color: #800080">$this</span>-><span style="color: #000000">pageNo;
</span><span style="color: #800080">$this</span>->pageNo = <span style="color: #800080">$this</span>->pageNo > <span style="color: #800080">$this</span>->pageCount? <span style="color: #800080">$this</span>->pageCount : <span style="color: #800080">$this</span>-><span style="color: #000000">pageNo;
</span><span style="color: #008000">//</span><span style="color: #008000">计算偏移</span>
<span style="color: #800080">$this</span>->offset = ( <span style="color: #800080">$this</span>->pageNo - 1 ) * <span style="color: #800080">$this</span>-><span style="color: #000000">pageSize;
</span><span style="color: #008000">//</span><span style="color: #008000">计算是否有上一页下一页</span>
<span style="color: #800080">$this</span>->hasPrePage = <span style="color: #800080">$this</span>->pageNo == 1 ?<span style="color: #0000ff">false</span>:<span style="color: #0000ff">true</span><span style="color: #000000">;
</span><span style="color: #800080">$this</span>->hasNextPage = <span style="color: #800080">$this</span>->pageNo >= <span style="color: #800080">$this</span>->pageCount ?<span style="color: #0000ff">false</span>:<span style="color: #0000ff">true</span><span style="color: #000000">;
</span><span style="color: #800080">$this</span>->pageData = <span style="color: #800080">$pageData</span><span style="color: #000000">;
</span><span style="color: #800080">$this</span>->jsFunction = <span style="color: #800080">$jsFunction</span><span style="color: #000000">;
}
</span><span style="color: #008000">/*</span><span style="color: #008000">*
* 分页算法
* @return
</span><span style="color: #008000">*/</span>
<span style="color: #0000ff">private</span> <span style="color: #0000ff">function</span><span style="color: #000000"> generatePageList(){
</span><span style="color: #800080">$pageList</span> = <span style="color: #0000ff">array</span><span style="color: #000000">();
</span><span style="color: #0000ff">if</span>(<span style="color: #800080">$this</span>->pageCount ){
<span style="color: #0000ff">for</span>(<span style="color: #800080">$i</span>=0;<span style="color: #800080">$i</span>$this->pageCount;<span style="color: #800080">$i</span>++<span style="color: #000000">){
</span><span style="color: #008080">array_push</span>(<span style="color: #800080">$pageList</span>,<span style="color: #800080">$i</span>+1<span style="color: #000000">);
}
}</span><span style="color: #0000ff">else</span><span style="color: #000000">{
</span><span style="color: #0000ff">if</span>(<span style="color: #800080">$this</span>->pageNo ){
<span style="color: #0000ff">for</span>(<span style="color: #800080">$i</span>=0;<span style="color: #800080">$i</span>$i++<span style="color: #000000">){
</span><span style="color: #008080">array_push</span>(<span style="color: #800080">$pageList</span>,<span style="color: #800080">$i</span>+1<span style="color: #000000">);
}
</span><span style="color: #008080">array_push</span>(<span style="color: #800080">$pageList</span>,-1<span style="color: #000000">);
</span><span style="color: #008080">array_push</span>(<span style="color: #800080">$pageList</span>,<span style="color: #800080">$this</span>-><span style="color: #000000">pageCount);
}</span><span style="color: #0000ff">else</span> <span style="color: #0000ff">if</span>(<span style="color: #800080">$this</span>->pageNo > <span style="color: #800080">$this</span>->pageCount - 4<span style="color: #000000">){
</span><span style="color: #008080">array_push</span>(<span style="color: #800080">$pageList</span>,1<span style="color: #000000">);
</span><span style="color: #008080">array_push</span>(<span style="color: #800080">$pageList</span>,-1<span style="color: #000000">);
</span><span style="color: #0000ff">for</span>(<span style="color: #800080">$i</span>=5;<span style="color: #800080">$i</span>>0;<span style="color: #800080">$i</span>--<span style="color: #000000">){
</span><span style="color: #008080">array_push</span>(<span style="color: #800080">$pageList</span>,<span style="color: #800080">$this</span>->pageCount - <span style="color: #800080">$i</span>+1<span style="color: #000000">);
}
}</span><span style="color: #0000ff">else</span> <span style="color: #0000ff">if</span>(<span style="color: #800080">$this</span>->pageNo > 4 && <span style="color: #800080">$this</span>->pageNo $this->pageCount - 4<span style="color: #000000">){
</span><span style="color: #008080">array_push</span>(<span style="color: #800080">$pageList</span>,1<span style="color: #000000">);
</span><span style="color: #008080">array_push</span>(<span style="color: #800080">$pageList</span>,-1<span style="color: #000000">);
</span><span style="color: #008080">array_push</span>(<span style="color: #800080">$pageList</span>,<span style="color: #800080">$this</span>->pageNo -2<span style="color: #000000">);
</span><span style="color: #008080">array_push</span>(<span style="color: #800080">$pageList</span>,<span style="color: #800080">$this</span>->pageNo -1<span style="color: #000000">);
</span><span style="color: #008080">array_push</span>(<span style="color: #800080">$pageList</span>,<span style="color: #800080">$this</span>-><span style="color: #000000">pageNo);
</span><span style="color: #008080">array_push</span>(<span style="color: #800080">$pageList</span>,<span style="color: #800080">$this</span>->pageNo + 1<span style="color: #000000">);
</span><span style="color: #008080">array_push</span>(<span style="color: #800080">$pageList</span>,<span style="color: #800080">$this</span>->pageNo + 2<span style="color: #000000">);
</span><span style="color: #008080">array_push</span>(<span style="color: #800080">$pageList</span>,-1<span style="color: #000000">);
</span><span style="color: #008080">array_push</span>(<span style="color: #800080">$pageList</span>,<span style="color: #800080">$this</span>-><span style="color: #000000">pageCount);
}
}
</span><span style="color: #0000ff">return</span> <span style="color: #800080">$pageList</span><span style="color: #000000">;
}
</span><span style="color: #008000">/*</span><span style="color: #008000">**
* 创建分页控件
* @param
* @return String
</span><span style="color: #008000">*/</span>
<span style="color: #0000ff">public</span> <span style="color: #0000ff">function</span><span style="color: #000000"> echoPageAsDiv(){
</span><span style="color: #800080">$pageList</span> = <span style="color: #800080">$this</span>-><span style="color: #000000">generatePageList();
</span><span style="color: #800080">$pageString</span> ="<div class="pagination"><div class="page-bottom">"<span style="color: #000000">;
</span><span style="color: #0000ff">if</span>(!<span style="color: #0000ff">empty</span>(<span style="color: #800080">$pageList</span><span style="color: #000000">)){
</span><span style="color: #0000ff">if</span>(<span style="color: #800080">$this</span>->pageCount >1<span style="color: #000000">){
</span><span style="color: #0000ff">if</span>(<span style="color: #800080">$this</span>-><span style="color: #000000">hasPrePage){
</span><span style="color: #800080">$pageString</span> = <span style="color: #800080">$pageString</span> ."$this->jsFunction . "(" . (<span style="color: #800080">$this</span>->pageNo-1) . ")\">上一页"<span style="color: #000000">;
}
</span><span style="color: #0000ff">foreach</span> (<span style="color: #800080">$pageList</span> <span style="color: #0000ff">as</span> <span style="color: #800080">$k</span>=><span style="color: #800080">$p</span><span style="color: #000000">){
</span><span style="color: #0000ff">if</span>(<span style="color: #800080">$this</span>->pageNo == <span style="color: #800080">$p</span><span style="color: #000000">){
</span><span style="color: #800080">$pageString</span> = <span style="color: #800080">$pageString</span> ."<span class="page-cur">" . <span style="color: #800080">$this</span>->pageNo . "</span>"<span style="color: #000000">;
</span><span style="color: #0000ff">continue</span><span style="color: #000000">;
}
</span><span style="color: #0000ff">if</span>(<span style="color: #800080">$p</span> == -1<span style="color: #000000">){
</span><span style="color: #800080">$pageString</span> = <span style="color: #800080">$pageString</span> ."<span class="page-break">...</span>"<span style="color: #000000">;
</span><span style="color: #0000ff">continue</span><span style="color: #000000">;
}
</span><span style="color: #800080">$pageString</span> = <span style="color: #800080">$pageString</span> ."$this->jsFunction . "(" . <span style="color: #800080">$p</span> . ")\">" . <span style="color: #800080">$p</span> . ""<span style="color: #000000">;
}
</span><span style="color: #0000ff">if</span>(<span style="color: #800080">$this</span>-><span style="color: #000000">hasNextPage){
</span><span style="color: #800080">$pageString</span> = <span style="color: #800080">$pageString</span> ."$this->jsFunction . "(" . (<span style="color: #800080">$this</span>->pageNo+1) . ")\">下一页"<span style="color: #000000">;
}
}
}
</span><span style="color: #800080">$pageString</span> = <span style="color: #800080">$pageString</span> .("</div></div>"<span style="color: #000000">);
</span><span style="color: #0000ff">return</span> <span style="color: #800080">$pageString</span><span style="color: #000000">;
}
}
</span>?>登入後複製
<span style="color: #800000"><style type="text/css">
<!--
.pagination </style></span>{<span style="color: #ff0000">font-family</span>:<span style="color: #0000ff"> Tahoma</span>;<span style="color: #ff0000">overflow</span>:<span style="color: #0000ff"> hidden</span>;<span style="color: #ff0000"> padding-top</span>:<span style="color: #0000ff"> 12px</span>;<span style="color: #ff0000"> text-align</span>:<span style="color: #0000ff"> center</span>;}<span style="color: #800000">
.pagination-tab </span>{<span style="color: #ff0000"> margin-bottom</span>:<span style="color: #0000ff"> 20px</span>;}<span style="color: #800000">
.pagination a, .pagination .page-cur, .pagination .page-prev_g, .pagination .page-prev, .pagination .page-next, .pagination .page-next_g, .pagination .page-break, .pagination .page-skip </span>{<span style="color: #ff0000">
display</span>:<span style="color: #0000ff"> inline-block</span>;<span style="color: #ff0000">font-family</span>:<span style="color: #0000ff"> Tahoma,SimSun,Arial</span>;<span style="color: #ff0000"> height</span>:<span style="color: #0000ff"> 22px</span>;<span style="color: #ff0000">line-height</span>:<span style="color: #0000ff">22px</span>;<span style="color: #ff0000"> margin</span>:<span style="color: #0000ff"> 0</span>;<span style="color: #ff0000"> min-width</span>:<span style="color: #0000ff"> 16px</span>;<span style="color: #ff0000">padding</span>:<span style="color: #0000ff"> 0 5px</span>;<span style="color: #ff0000"> text-align</span>:<span style="color: #0000ff"> center</span>;<span style="color: #ff0000"> vertical-align</span>:<span style="color: #0000ff"> top</span>;<span style="color: #ff0000"> white-space</span>:<span style="color: #0000ff"> nowrap</span>;}<span style="color: #800000">
.pagination a, .pagination .page-prev_g, .pagination .page-prev, .pagination .page-next, .pagination .page-next_g, .pagination .page-cur, .pagination .page-break </span>{<span style="color: #ff0000">
border</span>:<span style="color: #0000ff"> 1px solid #ed3d83</span>;<span style="color: #ff0000"> color</span>:<span style="color: #0000ff">#e9357d</span>;<span style="color: #ff0000"> font-weight</span>:<span style="color: #0000ff">bold</span>;}<span style="color: #800000">
.pagination a:hover </span>{<span style="color: #ff0000"> border</span>:<span style="color: #0000ff"> 1px solid #ed3d83</span>;<span style="color: #ff0000">text-decoration</span>:<span style="color: #0000ff"> none</span>;<span style="color: #ff0000"> background-color</span>:<span style="color: #0000ff">#f95f9d</span>;<span style="color: #ff0000"> color</span>:<span style="color: #0000ff">#fff</span>;}<span style="color: #800000">
.pagination .page-prev_g, .pagination .page-prev, .pagination .page-next, .pagination .page-next_g </span>{<span style="color: #ff0000"> width</span>:<span style="color: #0000ff"> 36px</span>;<span style="color: #ff0000"> background-image</span>:<span style="color: #0000ff"> url(../static/img/page.gif)</span>;}<span style="color: #800000">
.pagination .page-prev </span>{<span style="color: #ff0000"> background-position</span>:<span style="color: #0000ff"> -0px -38px</span>;<span style="color: #ff0000"> padding-left</span>:<span style="color: #0000ff"> 16px</span>;}<span style="color: #800000">
.pagination .page-prev_g </span>{<span style="color: #ff0000"> background-position</span>:<span style="color: #0000ff">0px -59px</span>;<span style="color: #ff0000"> padding-left</span>:<span style="color: #0000ff"> 16px</span>;<span style="color: #ff0000"> color</span>:<span style="color: #0000ff">#cbcbcb</span>;<span style="color: #ff0000"> font-weight</span>:<span style="color: #0000ff">normal</span>;}<span style="color: #800000">
.pagination .page-next </span>{<span style="color: #ff0000"> background-position</span>:<span style="color: #0000ff"> 0px 0px</span>;<span style="color: #ff0000"> padding-right</span>:<span style="color: #0000ff"> 16px</span>;<span style="color: #ff0000"> font-weight</span>:<span style="color: #0000ff">normal</span>;}<span style="color: #800000">
.pagination .page-next_g </span>{<span style="color: #ff0000"> background-position</span>:<span style="color: #0000ff"> -0px -19px</span>;<span style="color: #ff0000"> padding-right</span>:<span style="color: #0000ff"> 16px</span>;<span style="color: #ff0000"> color</span>:<span style="color: #0000ff">#cbcbcb</span>;}<span style="color: #800000">
.pagination .page-cur </span>{<span style="color: #ff0000">background-color</span>:<span style="color: #0000ff"> #f95f9d</span>;<span style="color: #ff0000"> border</span>:<span style="color: #0000ff"> 1px solid #ed3d83</span>;<span style="color: #ff0000">color</span>:<span style="color: #0000ff"> #fff</span>;<span style="color: #ff0000">font-weight</span>:<span style="color: #0000ff"> bold</span>;}<span style="color: #800000">
.pagination .page-break </span>{<span style="color: #ff0000">border</span>:<span style="color: #0000ff"> medium none</span>;<span style="color: #ff0000"> background</span>:<span style="color: #0000ff">none transparent</span>;<span style="color: #ff0000"> color</span>:<span style="color: #0000ff">#333</span>;}<span style="color: #800000">
-->
</span>登入後複製
<span style="color: #008000">//</span><span style="color: #008000">php调用 </span>
<span style="color: #800080">$pageNo</span> = <span style="color: #800080">$_GET</span>['pageNo'<span style="color: #000000">];
</span><span style="color: #0000ff">if</span>(<span style="color: #0000ff">empty</span>(<span style="color: #800080">$pageNo</span><span style="color: #000000">)){
</span><span style="color: #800080">$pageNo</span> = 1<span style="color: #000000">;
}
</span><span style="color: #008000">//</span><span style="color: #008000">分页数据</span>
<span style="color: #800080">$pageData</span> = News::getNewsPage(<span style="color: #800080">$pageNo</span>,<span style="color: #800080">$pageSize</span><span style="color: #000000">);
</span><span style="color: #008000">//</span><span style="color: #008000">取得总行数</span>
<span style="color: #800080">$count</span> = News::<span style="color: #000000">getNewsCount();
</span><span style="color: #008000">//</span><span style="color: #008000">创建分页器</span>
<span style="color: #800080">$p</span> = <span style="color: #0000ff">new</span> PageView(<span style="color: #800080">$count</span>['0']['TOTAL'],<span style="color: #800080">$pageSize</span>,<span style="color: #800080">$pageNo</span>,<span style="color: #800080">$pageData</span><span style="color: #000000">);
</span><span style="color: #008000">//</span><span style="color: #008000">生成页码</span>
<span style="color: #800080">$pageViewString</span> = <span style="color: #800080">$p</span>->echoPageAsDiv();登入後複製
本網站聲明
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn
熱AI工具
Undresser.AI Undress
人工智慧驅動的應用程序，用於創建逼真的裸體照片
AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。
Undress AI Tool
免費脫衣圖片
Clothoff.io
AI脫衣器
Video Face Swap
使用我們完全免費的人工智慧換臉工具，輕鬆在任何影片中換臉！
熱門文章
刺客信條陰影：貝殼謎語解決方案
4 週前
By DDD
Windows 11 KB5054979中的新功能以及如何解決更新問題
3 週前
By DDD
在哪裡可以找到原子中的起重機控制鑰匙卡
4 週前
By DDD
<🎜>：死鐵路 - 如何完成所有挑戰
1 個月前
By DDD
Atomfall指南：項目位置，任務指南和技巧
1 個月前
By DDD
熱工具
記事本++7.3.1
好用且免費的程式碼編輯器
SublimeText3漢化版
中文版，非常好用
禪工作室 13.0.1
強大的PHP整合開發環境
Dreamweaver CS6
視覺化網頁開發工具
SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)
適用於 Ubuntu 和 Debian 的 PHP 8.4 安裝和升級指南
Dec 24, 2024 pm 04:42 PM
PHP 8.4 帶來了多項新功能、安全性改進和效能改進，同時棄用和刪除了大量功能。 本指南介紹如何在 Ubuntu、Debian 或其衍生版本上安裝 PHP 8.4 或升級到 PHP 8.4
如何設定 Visual Studio Code (VS Code) 進行 PHP 開發
Dec 20, 2024 am 11:31 AM
Visual Studio Code，也稱為 VS Code，是一個免費的原始碼編輯器 - 或整合開發環境 (IDE) - 可用於所有主要作業系統。 VS Code 擁有大量針對多種程式語言的擴展，可以輕鬆編寫
在PHP API中說明JSON Web令牌（JWT）及其用例。
Apr 05, 2025 am 12:04 AM
JWT是一種基於JSON的開放標準，用於在各方之間安全地傳輸信息，主要用於身份驗證和信息交換。 1.JWT由Header、Payload和Signature三部分組成。 2.JWT的工作原理包括生成JWT、驗證JWT和解析Payload三個步驟。 3.在PHP中使用JWT進行身份驗證時，可以生成和驗證JWT，並在高級用法中包含用戶角色和權限信息。 4.常見錯誤包括簽名驗證失敗、令牌過期和Payload過大，調試技巧包括使用調試工具和日誌記錄。 5.性能優化和最佳實踐包括使用合適的簽名算法、合理設置有效期、
您如何在PHP中解析和處理HTML/XML？
Feb 07, 2025 am 11:57 AM
本教程演示瞭如何使用PHP有效地處理XML文檔。 XML（可擴展的標記語言）是一種用於人類可讀性和機器解析的多功能文本標記語言。它通常用於數據存儲
php程序在字符串中計數元音
Feb 07, 2025 pm 12:12 PM
字符串是由字符組成的序列，包括字母、數字和符號。本教程將學習如何使用不同的方法在PHP中計算給定字符串中元音的數量。英語中的元音是a、e、i、o、u，它們可以是大寫或小寫。 什麼是元音？ 元音是代表特定語音的字母字符。英語中共有五個元音，包括大寫和小寫： a, e, i, o, u 示例 1 輸入：字符串 = "Tutorialspoint" 輸出：6 解釋 字符串 "Tutorialspoint" 中的元音是 u、o、i、a、o、i。總共有 6 個元
解釋PHP中的晚期靜態綁定（靜態：:)。
Apr 03, 2025 am 12:04 AM
靜態綁定（static::）在PHP中實現晚期靜態綁定（LSB），允許在靜態上下文中引用調用類而非定義類。 1）解析過程在運行時進行，2）在繼承關係中向上查找調用類，3）可能帶來性能開銷。
什麼是PHP魔術方法（__ -construct，__destruct，__call，__get，__ set等）並提供用例？
Apr 03, 2025 am 12:03 AM
PHP的魔法方法有哪些？ PHP的魔法方法包括：1.\_\_construct，用於初始化對象；2.\_\_destruct，用於清理資源；3.\_\_call，處理不存在的方法調用；4.\_\_get，實現動態屬性訪問；5.\_\_set，實現動態屬性設置。這些方法在特定情況下自動調用，提升代碼的靈活性和效率。
神秘的JavaScript：它的作用以及為什麼重要
Apr 09, 2025 am 12:07 AM
JavaScript是現代Web開發的基石，它的主要功能包括事件驅動編程、動態內容生成和異步編程。 1)事件驅動編程允許網頁根據用戶操作動態變化。 2)動態內容生成使得頁面內容可以根據條件調整。 3)異步編程確保用戶界面不被阻塞。 JavaScript廣泛應用於網頁交互、單頁面應用和服務器端開發，極大地提升了用戶體驗和跨平台開發的靈活性。
