web前端常用技術點001

RobinsonZhang發表於2018-10-30

前言

本文主要總結了一些線上文件的實用技術,後面陸續會根據實際需求將不同的技術進行分類或者歸到相容文件裡。

技術點如下

遮蔽滑鼠右鍵

方案:oncontextmenu=”window.event.returnValue=false”

取消選取、防止複製

方案:onselectstart=”return false”

JS不允許貼上

方案:onpaste=”return false”

JS防止複製

方案:oncopy=”return false;” oncut=”return false;”

可以在收藏夾中顯示出你的圖示

方案:< link rel=”Bookmark” href=”favicon.ico”>

關閉輸入法

方案:< input style=”ime-mode:disabled”>

防止被人 frame

方案:

< script >
if (top.location != self.location)top.location=self.location;
< /script>
複製程式碼

網頁將不能被另存為

方案:< noscript>< iframe src=*.html>< /iframe>< /noscript>

檢視網頁原始碼

方案:< input type=button value=檢視網頁原始碼 onclick=”window.location = “view-source:”+ “www.pconline.com.cn””>

游標是停在文字框文字的最後

方案:

< script language=”javascript”>
function cc()
{
var e = event.srcElement;
var r =e.createTextRange();
r.moveStart(“character”,e.value.length);
r.collapse(true);
r.select();
}
< /script>
< input type=text name=text1 value=”123″ onfocus=”cc()”>
複製程式碼

網頁不會被快取

方案:

< META HTTP-EQUIV=”pragma” CONTENT=”no-cache”>
< META HTTP-EQUIV=”Cache-Control” CONTENT=”no-cache, must-revalidate”>
< META HTTP-EQUIV=”expires” CONTENT=”Wed, 26 Feb 1997 08:21:57 GMT”>
或者< META HTTP-EQUIV=”expires” CONTENT=”0″>
複製程式碼

怎樣去掉圖片連結點選後,圖片周圍的虛線

方案:< a href=”#” onFocus=”this.blur()”>< img src=”logo.jpg” border=0>< /a>

如何設定開啟頁面的大小

方案:

< body onload=”top.resizeTo(300,200);”>
//開啟頁面的位置
< body onload=”top.moveBy(300,200);”>
複製程式碼

ENTER 鍵可以讓游標移到下一個輸入框

方案:< input onkeydown=”if(event.keyCode==13)event.keyCode=9″>

各種樣式的游標

方案: auto :標準游標 ;default :標準箭頭 ; hand :手形游標; wait :等待游標; text :I 形游標; vertical-text :水平; I 形游標; no-drop :不可拖動游標 ; not-allowed :無效游標 ; help :?幫助游標 ; all-scroll :三角方向標; move :移動標; crosshair :十字標;其他: e-resize n-resize nw-resize w-resize s-resize se-resize sw-resize

在規定時間內跳轉

方案:< META http-equiv=V=”REFRESH” content=”5;URL=http://www.51js.com”>

將徹底遮蔽滑鼠右鍵

方案:oncontextmenu=”window.event.returnValue=false”

ie與其他瀏覽器的區別

解析:在獲取屬性,ajax請求,事件座標,透明的寫法,阻止冒泡等均是不同的。 參考資料:ie與其他瀏覽器區別

web應用向前端推送資料的方式

  • js
  • Commet:基於HTTP長連線的伺服器推送技術
  • 基於WebSocket的推送方案
  • SSE(Server-Send Event):伺服器推送資料新方式 方案:oncontextmenu=”window.event.returnValue=false”

實現文字縮排

方案:text-indent 可以實現文字的縮排

將徹底遮蔽滑鼠右鍵

方案:oncontextmenu=”window.event.returnValue=false”

java根據html程式碼生成pdf檔案

方案:參考程式碼

public void createPdf() throws Exception {  
        // step 1  
        String inputFile = "index.html";  
        String url = new File(inputFile).toURI().toURL().toString();  
        String outputFile = "index.pdf";  
        System.out.println(url);  
        // step 2  
        OutputStream os = new FileOutputStream(outputFile);  
        org.xhtmlrenderer.pdf.ITextRenderer renderer = new ITextRenderer();  
        renderer.setDocument(url);  
  
        // step 3 解決中文支援  
        org.xhtmlrenderer.pdf.ITextFontResolver fontResolver = renderer  
                .getFontResolver();  
        fontResolver.addFont("c:/Windows/Fonts/simsun.ttc", BaseFont.IDENTITY_H,     
                BaseFont.NOT_EMBEDDED);  
  
        renderer.layout();  
        renderer.createPDF(os);  
        os.close();  
          
        System.out.println("create pdf done!!");  
    }  
       
複製程式碼

載入https協議的檔案

大家在使用原始方式載入指令碼或者樣式檔案的時候,一般cdn的建議方式是https的,但我們的應用協議不一定是https的,這種時候使用// ,會自動識別當前頁面適合的協議,如果你強行使用https就會報錯或者很慢

參考文件

相關文章