Jquery动态插入li元素

来源：互联网发布：部队网络安全教育编辑：程序博客网时间：2024/05/21 01:51

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <meta name="viewport" content="width=device-width, initial-scale=1.0">    <meta http-equiv="X-UA-Compatible" content="ie=edge">    <title>Document</title>    <script src="jquery-3.2.1.js"></script>    $(document).ready(function(){            var arrFir=[{"name":"百度",'link':'https://www.baidu.com'},{"name":"w3school",'link':'http://www.w3school.com.cn/jquery/jquery_dom_get.asp'},{"name":"runoob",'link':'http://www.runoob.com/js/js-tutorial.html'}];            var arrSec=['aaa','bbb','ccc'];            for(var i=0;i<arrFir.length;i++){                $('#fir').append('<li><a href='+arrFir[i].link+' target="_blank">'+arrFir[i].name+'</a></li> ');            }            for(var i=0;i<arrSec.length;i++){                $('#sec').append('<li><a href="#">'+arrSec[i]+'</a></li> ');            }        });</head><body>    <div id="thir">        <ul id="fir"></ul>        <ul id="sec"></ul>    </div></body>

显示效果如下图

这里写图片描述

阅读全文

0 0