AppImage数据源过滤

<html>
<head>
<title>Appimage</title>
<style>
a { text-decoration:none; }
table { border-collapse:collapse; }
th, td { border:1px solid gray; }
</style>
</head>
<body>
<h1 align=center><a href='https://appimage.github.io/apps/' target='_blank'>Apps in AppImage format</a></h1>
<p align="center"><a href="https://appimage.github.io/search.json" target="_blank">数据源</a></p>
<div align=center>
<input type=text id=text_search> <input type=button id=button_search value=search> <input type=button id=button_reset value=reset>
</div>
<br>
<div id=tb align="center"></div>
<script>
var item, table;

function draw_table() {
    var ts='<table id=apps><tr><th>Name</th><th>Category</th><th>Tags</th><th>Url</th><th>Date</th></tr>';
    for (var i=0; i<item.length; i++) {
        	ts += '<tr>';
        	for (var j=0; j<item[0].length; j++) {
			if (j==3)
	        		ts += '<td><a href="' + item[i][j] + '" target="_blank">' + item[i][j]+'</a></td>';
			else
				ts += '<td>' + item[i][j] + '</td>';
        	}
        	ts += '</tr>';
    }
    ts += '</table>';
    document.getElementById('tb').innerHTML= ts;
	table = document.getElementById('apps');
}

function init_array(data) {
	`{
      "title"    : "AlphaT",
      "category" : "",
      "tags"     : "",
      "url"      : "https://appimage.github.io/apps/AlphaT",
      "date"     : ""
    }`
    item = new Array();
	for (var i=0; i<data.length; i++) {
		item.push([data[i].title, data[i].category, data[i].tags, data[i].url, data[i].date]);
	}
	draw_table();
}

fetch("https://appimage.github.io/search.json")
	.then(function (response) {
    		return response.json();
	})
	.then(function (data) {
		init_array(data);
    })

function showAll() {
    for (var i=1; i<table.rows.length; i++) {
        table.rows[i].style.display = '';
    }
}

function hideAll() {
    for (var i=1; i<table.rows.length; i++) {
        table.rows[i].style.display = 'none';
    }
}

function search(text) {
    hideAll();
    //var table = document.getElementById('apps');
    for (var i=1; i<table.rows.length; i++) {
        for (var j=0; j<table.rows[i].cells.length; j++) {
            if (table.rows[i].cells[j].innerText.toLowerCase().indexOf(text.toLowerCase()) != -1) { //速度快
                table.rows[i].style.display = '';
                break;
            }
        }        
    }
}

document.getElementById('text_search').onkeypress = function(event) {
    if (event.keyCode == 13) {
         search(document.getElementById('text_search').value);
    }
};

document.getElementById('button_search').onclick = function() {
    search(document.getElementById('text_search').value);
};

document.getElementById('button_reset').onclick = function() {
    showAll();
};
</script>
</body>
</html>

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值