前端知识——DOM、jQuery

DOM

　　查找：

　　　　直接查找

　　　　间接查找

　　　　--getElementById

　　　　--getElementsByTagName

 

 

　　操作：

　　　　值

　　　　　　innerText

　　　　　　innerHtml

　　　　　　value

　　　　class：

　　　　　　className

　　　　　　classList.add

　　　　　　classList.remove

    
    
    


        

            
        

        

        

            取消
        
        

 

 

　　　　样式：

　　　　　　　

　　　　　　　tag = .....

　　　　　　　tag.style.color = 'red';

　　　　　　　tag.style.fontSize = '40px';

　　　　属性：

　　　　　　　

　　　　　　　setAttribute

　　　　　　　getAttribute

　　　　　　　removeAttribute

　　　　　　　　　　===>

　　　　　　　　　　　　tabObj.checked = true

　　　　　　　　　　===>jQuery:操作数据，prop(checked,true)

    
    


    
    
    

    

        

            

                
序号
                
用户
                
密码
            
        
        

            

                

                
1
                
11
            
            

                

                
2
                
22
            
            

                

                
3
                
33
            
        
    

    

 

 

　　　　标签：

　　　　　　创建标签：

　　　　　　　　字符串

　　　　　　　　对象

　　　　　　　　将标签添加到HTML中

　　　　　　　　　　字符串形式的标签：

　　　　　　　　　　　　　　p1.insertAdjacentHTML('beforeEnd',tag);

　　　　　　　　　　对象形式的标签：

　　　　　　　　　　　　　　p1.insertAdjacentElement('afterBegin',document.createElement('p')) xxx.insertBefore(tag,xxx[1])

　　　　　点赞：

　　　　　　　　创建标签，定时器（大小，位置，透明度）

　　　　　　　　　　1、this，当前触发事件的标签

　　　　　　　　　　2、createElement

　　　　　　　　　　3、appendChild

　　　　　　　　　　4、setInterval创建定时器 clearInterval删除定时器

　　　　　　　　　　5、removeChild删除子标签

    
    
    


        

            
                赞1
            
        
        

            
                赞2
            
        
        

            
                赞3
            
        
        

            
                赞4
            
        
        

 

 

　　　　　　定时器

　　　　　　　　　setTimeOut,

　　　　　　　　　clearTimeout

　　　　　　　　　setInterval

　　　　　　　　　clearInter

　　　　　　事件：

　　　　　　　　　1、this，当前触发事件的标签

　　　　　　　　　2、全局事件绑定 window.onKeyDown = function(){}

　　　　　　　　　3、event，包含事件相关内容

　　　　　　　　　4、默认事件

　　　　　　　　　　　　　　自定义优先：a,form

　　　　　　　　　　　　　　默认优先：checkbox

    
    
    


        

        
回到顶部

        

 

 

 

jQuery

　　　　　　模块

　　　　　　　　　Dom和JavaScript

　　　　　　　　　　1.12.. --> ...

　　　　　　　　　　2.x --> IE9

　　　　　　　　　查找：

　　　　　　　　　　选择器

　　　　　　　　　　　　id选择器

　　　　　　　　　　　　标签选择器

　　　　　　　　　　　　类选择器

　　　　　　　　　　　　组合

　　　　　　　　　　　　层级 #i1 .c1

　　　　　　　　　　　　$('input:eq(1),#i1 .item')

　　　　　　筛选器

　　　　　　　　　　$('#i1').find('.item') $('#i1').eq(1)

　　　　　　　　　　操作：

　　　　　　　　　　　　CSS

　　　　　　　　　　　　属性

　　　　　　　　　　　　　　　$('#i1').html() # 获取html内容

　　　　　　　　　　　　　　　$('#i1').html("123") # 设置html内容

　　　　　　　　　　　　　text()

　　　　　　　　　　　　　val()

　　　　　　　　　　　　　文本操作

　　　　　　　　　　事件：

　　　　　　　　　　　　- 优化

　　　　　　　　　　　　　　1、如何使用jQuery绑定

　　　　　　　　　　　　　　2、当文档加载完毕后，自动执行 $(function(){ ... });

　　　　　　　　　　　　　　3、延迟绑定

　　　　　　　　　　　　　　4、return false;

    
    
     




        

            
菜单一
            

                
内容一
                
内容一
                
内容一
                
内容一
                
内容一
            

        
        


            
菜单二
            

                
内容二
                
内容二
                
内容二
                
内容二
                
内容二
                
内容二
            
        
        

            
菜单三
            

                
内容三
                
内容三
                
内容三
                
内容三
                
内容三
                
内容三
            

        
    
    
    

 

转载于:https://www.cnblogs.com/wlzhc/p/5812598.html