來源：https://www.cnblogs.com/sunxiuwen/p/10261188.html

閱讀目錄

jq創(chuàng)建標(biāo)簽
jq添加屬性如href，id，class，name等
jq添加style屬性即css，如width，height，text_aling
jq向標(biāo)簽里添加標(biāo)簽
在父標(biāo)簽里添加子標(biāo)簽
jq獲取checkbox的值
前端接收后端json數(shù)據(jù)，循環(huán)遍歷添加標(biāo)簽

jq創(chuàng)建標(biāo)簽
var ptag = $('<p>');  

jq添加屬性如href，id，class，name等

$('#content').attr('class/id/name/href', 'active')

$('#id').html('標(biāo)簽的文本')

$('#input).val('xxxxxxx')


jq添加style屬性即css，如width，height，text_aling
$("div").css({"background-color":"yellow","font-size":"200%"});

var css = {
    background-color: '#EEE',
    height: '500px',
    margin: '10px',
    padding: '2px 5px'
};
$("div").css(css);

jq向標(biāo)簽里添加標(biāo)簽
var ptag = $('p')

在父標(biāo)簽里添加子標(biāo)簽
$('#id').append(ptag)

jq獲取checkbox的值
<ul >
                <li><input type="checkbox" name="friend_name" value="zhangshan">張三</li>
                <li><input type="checkbox" name="friend_name" value="lisi">李四</li>
                <li><input type="checkbox" name="friend_name" value="python">派神</li>
                <li><input type="checkbox" name="friend_name" value="java">加瓦</li>
</ul>


<script>
var friend_name = new Array()
        $('input[name="friend_name"]:checked').each(function (i) {
            friend_name[i] = $(this).val()
        });

</script>


前端接收后端json數(shù)據(jù)，循環(huán)遍歷添加標(biāo)簽
https://www.cnblogs.com/dibaosong/p/4572274.html
https://blog.csdn.net/qq_36229817/article/details/79816297

// 后端數(shù)據(jù)格式為：{key:value,key:value}
function userEdit(t) {
            // 1. 點(diǎn)擊按鈕時(shí)，獲取該條信息的用戶id，去獲取該用戶信息
            // 2. 將信息賦值給模態(tài)框，然后顯示模態(tài)框
            // 3. 用戶修改完信息后，點(diǎn)擊保存，將數(shù)據(jù)發(fā)給后端保存，保存成功彈出對話框，告知保存成功，失敗讓用戶重新提交
            let user_id = $(t).closest("tr").find("td").eq(1).text();
            $.ajax({
                type: "get",
                url: "/user/edit?user_id=" + user_id,
                success: function (d) {
                    console.log(d);
                    if (d.code != 0) {
                        alert(d.desc)
                    } else {
                        let user_data = d.data;
                        let html = "";
                        console.log(user_data)  // 如果獲取的是json字典
                        $.each(user_data, function (key, value) {
                            {#html += '<div class="form-group">n' +#}
                            {#    '                            <label for="name" class="col-sm-2 control-label">姓名:</label>n' +#}
                            {#    '                            <div class="col-sm-10">n' +#}
                            {#    '                                <input type="text" class=" form-control" id="name" placeholder="姓名">n' +#}
                            {#    '                            </div>n' +#}
                            {#    '                        </div>'#}

                            html += '<div class="form-group">' + '<label for="' + key + '" class="col-sm-2 control-label">' + key + ':</label>n'
                                + '<div class="col-sm-10"> n' +
                                '<input type="text" class=" form-control" id="' + key + '" placeholder="' + value + '">' + '</div>' + '</div>'

                        });
                        $("#user-form").append(html)
                    }
                }
            });

本站其他內(nèi)容推薦