zoukankan      html  css  js  c++  java
  • js技巧

    在说他们之间的转换之前先说一下他们之间的关系吧:

    js它是动态的弱类型的语言,是JavaScript的缩写,而jquery是对js的封装、扩展,jquery是使用js封装的框架,就是让

    jquery更方便简洁。举个例子吧,js就好比是生的面条,而jquery是方便面,泡一下就可以吃了,比较的方便。

    即:jquery是使用最少的代码来完成更多的功能。以上是我对js与jquery的区别的理解。

    下面说说他们之间的转换吧---

    原生js与jquery js
    怎么将原生js对象转换为jquery的js
    通过在原生js的外围加上 $ 
    eg:$(原生js)
    怎么将jquery  的js转换为原生js:
    通过在jquery的js后面加上get(0)来获取该jquery对象所对应的原生js
    小demo
    <script src="jquery-1.8.3.js"></script>
    <body>
    <input type="text" value="123" id="test">
    <input type="button" value="测试" onclick="test_()">
    </body>
    </html>
    <script>
    function test_() {
    //将原生的js转换为jquery的js--只需要在外围加上 $
    var test=document.getElementById("test").value;
    var testJquery=$(document.getElementById("test")).val();
    //alert(testJquery);


    //将jquery的js转换为原生的js,是加上get(0)
    var jqueryTest=$("#test").val();
    var testJs=$("#test").get(0).value;
    alert(testJs);
    }
    </script>

    ---------------------

    form表单target的用法

     

    form表单的target,当iframe设置为隐藏时,可以实现当前页表单提交而部进行跳转刷新,代码如下:

    <form action="提交的action" method="post" target="myIframe">
    .....................
    </form>
    <iframe name="myIframe" style="display:none"></iframe>

    提交到action后,action返回一串javascript语句

    js:

    String script = "<script>alert('hello!');</script>";
    response.getOutputStream().write(script.getBytes("utf-8"));

    alert("hello")将在当前页执行,原理是form提交后的结果在target指定的iframe里执行,iframe已经隐藏了,这样提交后的效果就和无刷新的效果一样。


    input的file类型的accept属性的值

    描述
    audio/* 接受所有的声音文件。
    video/* 接受所有的视频文件。
    image/* 接受所有的图像文件。
    MIME_type 一个有效的 MIME 类型,不带参数。请参阅 IANA MIME 类型,获得标准 MIME 类型的完整列表。

    在上传文件的时候,需要限制指定的文件类型,accept这个属性,只在FF和chrome中有效。那么accept能限制哪些文件呢?见下表。

    扩展名 MIME 描述

    *.3gpp audio/3gpp, video/3gpp 3GPP Audio/Video
    *.ac3 audio/ac3 AC3 Audio
    *.asf allpication/vnd.ms-asf Advanced Streaming Format
    *.au audio/basic AU Audio
    *.css text/css Cascading Style Sheets
    *.csv text/csv Comma Separated Values
    *.doc application/msword MS Word Document
    *.dot application/msword MS Word Template
    *.dtd application/xml-dtd Document Type Definition
    *.dwg image/vnd.dwg AutoCAD Drawing Database
    *.dxf image/vnd.dxf AutoCAD Drawing Interchange Format
    *.gif image/gif Graphic Interchange Format
    *.htm text/html HyperText Markup Language
    *.html text/html HyperText Markup Language
    *.jp2 image/jp2 JPEG-2000
    *.jpe image/jpeg JPEG
    *.jpeg image/jpeg JPEG
    *.jpg image/jpeg JPEG
    *.js text/javascript, application/javascript JavaScript
    *.json application/json JavaScript Object Notation
    *.mp2 audio/mpeg, video/mpeg MPEG Audio/Video Stream, Layer II
    *.mp3 audio/mpeg MPEG Audio Stream, Layer III
    *.mp4 audio/mp4, video/mp4 MPEG-4 Audio/Video
    *.mpeg video/mpeg MPEG Video Stream, Layer II
    *.mpg video/mpeg MPEG Video Stream, Layer II
    *.mpp application/vnd.ms-project MS Project Project
    *.ogg application/ogg, audio/ogg Ogg Vorbis
    *.pdf application/pdf Portable Document Format
    *.png image/png Portable Network Graphics
    *.pot application/vnd.ms-powerpoint MS PowerPoint Template
    *.pps application/vnd.ms-powerpoint MS PowerPoint Slideshow
    *.ppt application/vnd.ms-powerpoint MS PowerPoint Presentation
    *.rtf application/rtf, text/rtf Rich Text Format
    *.svf image/vnd.svf Simple Vector Format
    *.tif image/tiff Tagged Image Format File
    *.tiff image/tiff Tagged Image Format File
    *.txt text/plain Plain Text
    *.wdb application/vnd.ms-works MS Works Database
    *.wps application/vnd.ms-works Works Text Document
    *.xhtml application/xhtml+xml Extensible HyperText Markup Language
    *.xlc application/vnd.ms-excel MS Excel Chart
    *.xlm application/vnd.ms-excel MS Excel Macro
    *.xls application/vnd.ms-excel MS Excel Spreadsheet
    *.xlt application/vnd.ms-excel MS Excel Template
    *.xlw application/vnd.ms-excel MS Excel Workspace
    *.xml text/xml, application/xml Extensible Markup Language
    *.zip application/zip Compressed Archive

    实例 :

    1.accept="image/gif, image/jpeg"

    2.accept="application/msword"
    3.accept="application/pdf"
    4.accept="application/poscript"
    5.accept="application/rtf"
    6.accept="application/x-zip-compressed"
    7.accept="audio/basic"
    8.accept="audio/x-aiff"
    9.accept="audio/x-mpeg"
    10.accept="audio/x-pn/realaudio"
    11.accept="audio/x-waw"
    12.accept="image/gif"
    13.accept="image/jpeg"
    14.accept="image/tiff"
    15.accept="image/x-ms-bmp"
    16.accept="image/x-photo-cd"
    17.accept="image/x-png"
    18.accept="image/x-portablebitmap"
    19.accept="image/x-portable-greymap"
    20.accept="image/x-portable-pixmap"
    21.accept="image/x-rgb"
    22.accept="text/html"
    23.accept="text/plain"
    24.accept="video/quicktime"
    25.accept="video/x-mpeg2"
    26.accept="video/x-msvideo"

    office办公软件2007以后版本各文档的后缀名,如docx、xlsx

    1.  
      Extension MIME Type
    2.  
      .xlsx application/vnd.openxmlformats-officedocument.spreadsheetml.sheet
    3.  
      .xltx application/vnd.openxmlformats-officedocument.spreadsheetml.template
    4.  
      .potx application/vnd.openxmlformats-officedocument.presentationml.template
    5.  
      .ppsx application/vnd.openxmlformats-officedocument.presentationml.slideshow
    6.  
      .pptx application/vnd.openxmlformats-officedocument.presentationml.presentation
    7.  
      .sldx application/vnd.openxmlformats-officedocument.presentationml.slide
    8.  
      .docx application/vnd.openxmlformats-officedocument.wordprocessingml.document
    9.  
      .dotx application/vnd.openxmlformats-officedocument.wordprocessingml.template
    10.  
      .xlsm application/vnd.ms-excel.addin.macroEnabled.12
    11.  
      .xlsb application/vnd.ms-excel.sheet.binary.macroEnabled.12
  • 相关阅读:
    SpringMVC+bootstrap-fileinput文件上传插件使用入门
    [Java]实现Comparable接口不严谨导致Comparison method violates its general contract!
    2021寒假ACM集训队第一次训练-搜索(一)
    第八届“图灵杯”NEUQ-ACM程序设计竞赛个人赛-热身赛
    2021蓝桥杯第三次训练赛
    2021年蓝桥杯第二次训练赛
    2021年蓝桥杯第一次训练赛
    HDU 1312 Red and Black
    HDU 1010 Tempter of the Bone
    HDU 3500 Fling
  • 原文地址:https://www.cnblogs.com/Alex80/p/11108360.html
Copyright © 2011-2022 走看看