• 仿百度搜索


    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8" />
    <title>仿百度搜索</title>
    </head>
    <body>
    <div class="searchDemo">
    <input type="text" id="search_btn" />
    <table cellpadding="0" cellspacing="0">
    <tbody>
    <tr><td></td></tr>
    <tr><td></td></tr>
    <tr><td></td></tr>
    <tr><td></td></tr>
    <tr><td></td></tr>
    <tr><td></td></tr>
    <tr><td></td></tr>
    <tr><td></td></tr>
    <tr><td></td></tr>
    <tr><td></td></tr>
    </tbody>

    </table>
    </div>
    </body>
    <script type="text/javascript">
    function hideTds(){
    var tds = document.querySelectorAll('td');
    for (var i = 0; i < tds.length; i++) {
    tds[i].innerHTML = '';
    };
    }

    // hideTds();

    document.getElementById('search_btn').onkeyup = function(){
    var s = document.createElement('script');
    s.src = 'http://unionsug.baidu.com/su?wd=' + encodeURI(this.value.trim()) + '&p=3&cb=fn';
    document.body.appendChild(s);

    }
    function fn(data){
    console.log(data.s);
    var tds = document.querySelectorAll('td');
    data.s.forEach(function(value,index){
    console.log(value,index);
    tds[index].innerHTML = value;

    })

    var s = document.querySelectorAll('script');
    for (var i = 1; i < s.length; i++) {
    document.body.removeChild(s[i]);
    };

    }

    document.querySelector('tbody').onclick = function(e){
    var item = e.target.innerHTML;
    console.log(item);
    window.open('https://www.baidu.com/s?word='+encodeURI(item));
    }

    </script>
    </html>

  • 相关阅读:
    高德地图SDK大致使用
    AFNetworking 使用
    蓝牙相关
    svn 常用命令
    通过AutoLayout显示三个等宽视图
    适配相关 --AutoLayout ---SizeClass
    常用网页
    UIViewController加载过程
    UIApplication相关
    实现消息转发功能(调用非自己类方法)
  • 原文地址:https://www.cnblogs.com/cuikaitong/p/7605769.html
Copyright © 2020-2023  润新知