前端知识摘要

一、实现读取txt文本,修改并下载修改后的内容。html

html:浏览器

<input type="file" id="file" />
  <textarea class="text"></textarea> 
  <a class="down"  download>下载</a>

js:app

$("#file").change(function(e){
    var reader = new FileReader()
      var img1 = event.target.files[0]
      var filetext=''
      reader.readAsText(img1)
      reader.onloadend = () => {
        filetext = reader.result
        $(".text").text(filetext)
      }

  })
  var funDownload = function (content, filename) {
    var eleLink = document.createElement('a');
    eleLink.download = filename;
    eleLink.style.display = 'none';
    // 字符内容转变成blob地址
    var blob = new Blob([content]);
    eleLink.href = URL.createObjectURL(blob);
    // 触发点击
    document.body.appendChild(eleLink);
    eleLink.click();
    // 而后移除
    document.body.removeChild(eleLink);
  };
  $(".down").click(function(){
    funDownload($(".text").text(), 'a.txt');
  })

 二、element.insertAdjacentHTML(position, html);ide

三、获取浏览器上一页的url  >>>document.referrerurl

四、移动端屏幕滚动事件spa

$(window).scroll(function () {
      var t =$(window).scrollTop(),
        h = $(".header_menu").height()+$(".search-screen-title").height();
      if (t > h) {
        $(".search-screen__wraper").addClass("auto-fixed")
        $(".search-screen__wraper-space").show()        
      } else {
        $(".search-screen__wraper").removeClass("auto-fixed")
        $(".search-screen__wraper-space").hide()
      }
    })

第二行,之前是使用var t = $(document).scrollTop(),如今不支持这种写法,用过var t = $("body,html").scrollTop()。在谷歌浏览器上能够,可是真机运行又不行。code

五、html中video视频js实现暂停功能视频

var myvideo = document.getElementById("houseVideo")
myvideo.pause()

注意video一点要用id。不然没法获取到视频对象,致使里面的pause、load()、play()等方法调用报错htm

 6.只能输入正整数的input框实现对象

<input type='text' onkeyup="value=value.replace(/^(0+)|[^\d]+/g,'')">
相关文章
相关标签/搜索