用原生js写一个弹框

相信在平时的前端书写过程中,想要弹出一个框的话就用最简单的alert语句就能实现,那么如果要抛开后端抛开数据库,仅仅只用原生的js怎么实现一个弹框并且这个弹框会自动给你加东西呢呢? 你需要写两个html。 第一个:
<!DOCTYPE HTML>
<html>
<head>
  <meta charset='utf-8'>
  <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
</head>
<body>
    <div class='wrap'>
        <input id='name'  type='text'>
    <div class='button'>传递</div>
    <script>
        var oName=document.querySelector('#name');
        var val='';
        var oBtn=document.querySelector('.button');
        var Url=location.href;
        var str=Url.replace(/start\.html/,'end.html')
        console.log(str)
        oBtn.onclick=function(){
            val=oName.value;
            console.log(location.href);
            window.open(str+'?code='+val);
}
    </script>
</body>
</html>
 第二个页面:
<!DOCTYPE HTML>
<html>
<head>
<meta charset='utf-8'>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
</head>
<body>
<script>
    window.onload=function(){
       var Url=location.href;
       var name=decodeURI(Url.match(/code=(\S*)/)[1])
       alert(name+'我爱你')
}
</script>
</body>
</html>
 

猜你喜欢

转载自soyomo.iteye.com/blog/2375535