臨時筆記0318

時間 2019-12-20

標籤臨時筆記简体版

原文原文鏈接

1.jquery的屬性選擇器javascript

$('*[data-toggle-class]') 意思是找到有屬性名爲data-toggle-class的元素css

例如：網頁中的html代碼html

<a href="#" class="" data-toggle-class="" ><i>內容</i></a>java

此元素會被找到jquery

2.closest() 方法得到匹配選擇器的第一個祖先元素，從當前元素開始沿 DOM 樹向上。web

　　alert($(this).parent().parent().index)等同於：正則表達式

　　alert($(this).closest('tr').index);chrome

2.在eclipse裏面複製出一個項目的時候必定要記得修改項目名稱，否則在導入的時候會報錯誤，出現找不到文件,修改步驟數組

　　1.修改文件名，注意分級的問題app

　　2.打開eclipse裏面的項目，右擊屬性，找到web Project Settings 將Context root 進行（此處不修改，將仍是會訪問原來的項目）

3.禁止form表單自行提交，form下面有一個button，點擊是會自動提交表單裏面的數據，如何進行阻止呢？

　　在form裏面添加一行代碼：onsubmit：return false便可

4.在作電力監控的項目時，由於沒有在頁面中申明doctype，致使頁面整理佈局發生變化，02170808

5.js爲input的輸入框默認選擇當前時間

//默認顯示當前日期  
function DateInit(){  
    var data = new Date();  
    var year = data.getFullYear();  
    var month = data.getMonth() + 1;  
    var day = data.getDate();  
    month =month <10?"0"+month :month;  
    day=day<10?"0"+day:day;  
    var today=year+"-"+month+"-"+day;  
    $("#time").val(today);  
}

6.原生js的append方法在不一樣的chrome有版本兼容性的問題，改換成appendchild就能夠了

7.js判斷是pc仍是手機端訪問

<script type="text/javascript">
var ua = navigator.userAgent;
var ipad = ua.match(/(iPad).*OS\s([\d_]+)/),
isIphone =!ipad && ua.match(/(iPhone\sOS)\s([\d_]+)/),
isAndroid = ua.match(/(Android)\s+([\d.]+)/),
isMobile = isIphone || isAndroid;
//判斷
if(isMobile){

}else{

}

</script>

View Code

8.在作實時事件的時候，在彈出的頁面中先控制外層div的顯示和隱藏

    $("#id",top.window.document)或
    $("#id",parent.window.document)
    調用外層方法：
    parent.methodName()

　$("#main",window.parent.document)[0].contentWindow.submit()//調用外層頁面中的submit方法

9.頁籤 jquery的寫法

    $(this).parent().attr("class","active").siblings(".active").removeAttr("class");
    $(this).attrClass("hover").siblings(".hover").removeClass("hover");

10 如何選擇多個文字的第一個文字

var a ="嘎嘎嘎"

a.split("")[0];

11.split也能夠接收正則表達式

        var s = "123+456*789/123";
        var s1 = s.split(/[\+\-\*\/]/);
     console.log(s1);//【123,456,789,123】

12.white-space:nowrap只對行內元素起做用，不對塊級元素起做用，overflow對浮動的元素不起做用2018-04-17

13.hover使用問題，直接上代碼

原始問題代碼：

     .configImage:hover .delete{
        display:block;
    }
    #zlConfig .delete{
        display:none;
        position:absolute;
        height:100%;
        width:100%
    }

由於在作配置頁面的時候，delete的class與其餘配置頁面的class起了衝突，因此這裏要添加一個id進行區分，可是加上了這個id以後，hover就沒有了效果

緣由分析：由於hover先後的優先級不同，讓他們的優先級保持一致就行了

修改後的

    #zlConfig .configImage:hover .delete{
        display:block;
    }
    #zlConfig .delete{
        display:none;
        position:absolute;
        height:100%;
        width:100%
    }

14.在作信息發佈配置頁面的時候，使用了js動態的輪播，自動輪播能夠，一到了手動點擊輪播的時候就不成功（20180427）

　　緣由：父級元素的id沒有填寫，須要與實際的左右logo裏面以及下面的id相對應起來

    function buildFileList(panel,saveOption){
        //動態添加相應的樣式
        var id=panel.attr("id");
        var style='<style id="'+id+'_css">'+
                    '    #'+id+' .xxfbTable{color:'+saveOption.fontColor+';background-color:'+saveOption.fileBackColor+'}    '+
                    '    #'+id+' .xxfbTable li{border-color:'+saveOption.bordColor+';}'+
                    '    #'+id+' .xxfbTable li:hover{background-color:'+saveOption.hoverColor+';color:'+saveOption.hoverFontColor+'}'+
                    '</style>';
        $("body #"+id+"_css").remove();
        $("body").append(style);
        var mIndex=saveOption.blockIndex;
        //清空裏面的內容
        $(panel.find(".ipn-body")).html("");
        var resultArr=$.loadFileRelease();
        if(panel.find(".ipn-body .line").length==0){
            var str=
            '<div class="row" style="height:100%">                                         '+
            '        <div class="carousel slide" data-ride="carousel" id="carousel-example-generic" data-interval="4000">             '+
            '            <!-- 輪播Carousel指標 -->                             '+
            '            <ol class="carousel-indicators">                          '+
            '            </ol>                                                     '+
            '            <!-- 輪播Carousel項目 -->                             '+
            '            <div class="carousel-inner" >                             '+
            '            </div>                                                    '+
            '            <!-- 輪播Carousel導航 -->                             '+
            '            <a class="carousel-control left" href="#carousel-example-generic"       '+
            '               data-slide="prev">&lsaquo;</a>                         '+
            '            <a class="carousel-control right" href="#carousel-example-generic"      '+
            '               data-slide="next">&rsaquo;</a>                         '+
            '        </div>                                                        '+
            '</div>                                                               '    ;
            $(panel.find(".ipn-body")).append(str);
            //遍歷取過來的數據，將內容練成字符串追加到carousel-inner裏面
            var strul="",strol="",olIndex=0;
            for(var i=0;i<resultArr.length;i++){
                var tobj=resultArr[i];
                if(i%mIndex==0){//是第一頁 就建立ul同時追加li
                    strul=
                    $('    <div class="item">                                                                                            '+
                    '        <ul class="content xxfbTable">                                                                                    '+
                    '            <li data-id='+tobj.id+'>                                                                               '+
                    '                <h3 class="detail">'+tobj.title+'</h3>                                                             '+
                    '                <p>                                                                                                '+
                    '                    <span>'+tobj.author+'</span>:&nbsp;<span>'+tobj.greateTime+'</span>                            '+
                    '                    <span>'+tobj.contentHtml+'</span>                   '+
                    '                </p>                                                                                            '+
                    '            </li>                                                                                                '+
                    '        </ul> '+
                    '    </div>');
                    strol='<li data-target="#carousel-example-generic" data-slide-to="'+olIndex+'" class="active"></li>';
                    $(panel.find(".ipn-body").children().find('.carousel-indicators')).append(strol);
                    olIndex++;
                }else{//追加li
                    strul.find('.content').append(
                    '            <li data-id='+tobj.id+'>                                                                                   '+
                    '                <h3 class="detail">'+tobj.title+'</h3>                                                             '+
                    '                <p>                                                                                                '+
                    '                    <span>'+tobj.author+'</span>:&nbsp;<span>'+tobj.greateTime+'</span>                            '+
                    '                    <span>'+tobj.contentHtml+'</span>                                                                           '+
                    '                </p>                                                                                            '+
                    '            </li>                                                                                                '                    
                    );
                }
                if(i==0){strul.addClass("active");}
                //追加至輪播的內容
                $(panel.find(".ipn-body").children().find('.carousel-inner')).append(strul);
            }
        }else{
            panel.find(".ipn-body .line").show().empty();
        }
        //手動啓動輪播
        $(".carousel").carousel({  
            interval :5000,  
        }); 
    }

View Code

15.input 與label聯動的問題以及input-checkbox的時候不對齊問題，

　　正常label須要加上for與input的id對應，這樣就能夠關聯到

<label for="show_alarm">
    <input type="checkbox" id="show_alarm">本次再也不彈框
</label>

可是其實單個的input的時候能夠不用寫for，直接也能夠關聯，注意必須是不寫

label裏面有多個的時候，也只能關聯到第一個

<label><input type="checkbox" id="show_alarm">本次再也不彈框</label>

不對齊問題，只須要給input添加css樣式

vertical-aign:middle
margin:0 3px 1px 0px;/*只能是這麼寫，寫一個邊不會生效*/

16.時間插件點擊（在input上添加屬性readonly）

17.點擊屢次事件的時候會選中部分

爲外層div添加css

.unselect{
    -webkit-user-select:none;
    -moz-user-select:none;
    -o-user-select:none;
    user-select:none;
}

18 svn如何關閉進程（2019年4月1號）

在進程中找到TortoiseSVN status cache(小烏龜)，刪除掉

19 原生js查找元素

查找以上全部的img元素，同時包含屬性data-original、lazyload

document.querySelectorAll('img[data-original][lazyload]')

20.splice用法 2019年9月17號

　　需求：數組的裏面的值一直在追加，可是又要保證長度要一直不變

　　解決：splice，先在數組的最後位置去掉一個，在添加一個 splice(1,1,{})

　　舉例：

21.安裝mougoDb的時候電腦一直卡在應用程序正在爲首次使用計算機作準備，而後就卡住一直不動了（2019年10月11號）

解決辦法：這種緣由是由於你在上一次安裝的過程當中有中途中止的緣由

再次安裝，其實是由於進程沒有清除乾淨，找到進程中描述爲Windows 安裝程序的進程，殺掉多餘的進程便可，

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。