DOM知识点汇总

省市选择

   
   



请选择省

歌曲选择（全选，全不选，反选）

   
   

孤单北半球
花都开好了
Gee
我和草原有个约定

 

权限选择

   
   



添加
删除
查询
打印

金额文本框（只能输入特定的数字，输入时左对齐，输入完成右对齐并加上千分号，只能粘贴数字）

   
   

用快捷键不能粘贴，用鼠标可以。这是为什么呢？

正则表达式

   
   

JS中的正则表达式

JavaScript中创建正则表达式类的方法：

• var regex = new RegExp("\\d{5}")或者var regex = /\d{5}/


• /表达式/是JavaScript中专门为简化正则表达式编写而提供的语法，写在//中的正则表达式就不用管转义符了。

RegExp对象的方法：
（1）text(str)判断字符串Str是否匹配正则表达式，相当于C#中的IsMatch

var regex =/.+@.+/;
alert(regex.test("[email protected]"));
alert(regex.test("jdsak.com"));
（2）exec(str)进行搜索匹配，返回值为匹配结果。
（3）compile编译表达式，提高运行速度。








String对象中提供了一些与正则表达式相关的方法，相当于对于RegExp类的包装，简化调用：

match(regexp),相当于调用exec

var s ="[email protected]";
var regex=/(.+)@(.+)/;
var match = s.match(regex);
alert(RegExp.$1 + ",服务器："+RegExp.$2);

 

经校验后Submit提交

   

在点击Submit后Form的事件被触发，在Onsubmit中可以进行数据校验，数据有问题，返回False即可取消提交）

搜索框效果

   
   

点击小图显示详细资料

   
   

   
   

   

   

   

随鼠标移动五角星由空心变实心。

   
   

☆

☆

☆

☆

☆

☆★☆★☆★☆★

球队选择

   
   

• 湖人


• 黄蜂


• 火箭


• 马刺


• 小依

每一次学习的记忆痕迹太浅，根本没有刻入自己的大脑皮层。这样的学习，根本就是谋财害命！

 

GetElementById

   
   

 

GetElementByName

   
   


boy
girl
mimi

GetElementsByTagName

   
   

 

Reg延时（请仔细阅读协议，还有10秒）

   
   


</p> <p>　　　　　　<br> 　　</p> <p>

Write

   
   




焟炬成灰泪始干。

 千锤万打出深山，烈火焚烧浑不怕，要留清白在人间。
 

点超链接变色

        function linkOnClick() {
            var links = document.getElementsByTagName("a");
            for (var i = 0; i < links.length; i++) {
                var link = links[i];
                if (link == this) {
                    link.style.background = "blue";
                }
                else {
                    link.style.background = "white";
                }
            }
            window.event.returnValue = false;//超链接不生效
        }
   


加法
开灯
生成超链接
林依晨新闻

 

行变色

   
   

喜羊羊	100
慢羊羊	80
懒羊羊	50
红太狼	90
灰太狼	88
软绵羊	00

动态产生超链接

   
   

动态创建表格

   
   

动态产生的元素，查看源代码是看不到的，通过DebugBar--Dom--文档---HTML 可以看到

动态创建元素

   
   

传智播客

隔行变色

   
   

  

喜羊羊	100
慢羊羊	80
懒羊羊	50
红太狼	90
灰太狼	88
软绵羊	00

加法计算器

   
   


+

焦点在的文本框位置样式设置

   
   

开/关灯效果

   
   
   

   










控制层Div（点击Button即展开详细内容）

   
   


显示基本信息

学习态度：专注、热忱   QQ:495807986 Tel:15072453852

开灯

开灯：林依晨有啊有啊好像又没有了开灯吧

 

评分控件

   
   

☆

☆

☆

☆

☆

 

评论（无刷新）

   
   


这也太聪明了吧.有啊有啊，好像又没有了。

评论区

   
       
   

黄江苗：

我抢到沙发啦！

昵称：

事件冒泡：如果元素A嵌套在元素B中，那么A被点击不仅A的Onclick事件会被触发，B的Onclick也会被触发。触发的顺序是“由内而外”。

   

这里是P

 

This的用法

   
   

this指当前发生事件的对象，这样用不行：      function btnclick1() {
            alert(this.value);//在事件响应函数调用的函数里就不能通过this来获得事件对象了
        }

 

我要新闻代码

   
   


林依晨的资料

依晨好靓

修改样式

   
   

 

 

   
   

搅拌搅拌巧克力，搅拌搅拌巧克力，搅拌好吃的巧克力
林依晨：有啊有啊，好像又没有了，感觉怎么样？还不赖，什么？还不赖。

clipboardData(复制粘贴设置)

   
   





这些东本不能复制



请输入手机号码：


请再次手工输入：


本页面上的内容都不能复制，请输入手机号码文本框可粘贴，请再次手工输入文本框不得粘贴。

option optgroup radio

   
   

   
    huangrong
   
   
   
   
   
   
   
   
   

    男
   

    女
   

    保密
   

    水密桃汁
   

    百事可乐
   

    珍珠奶茶
   
    北京
    湖北
    上海
   
   
   
    北京
    湖北
    上海
   

   
       
            Gambia
            madagascar
            Namibia
       
       
            france
            russia
            UK
       
       
            canada
            mexico
            USA
         
   

   

 

 确实要离开此页吗

   
   

Updata，禁止访问页面

   






不能访问朵朵还是访问了
不能访问朵朵

标题滚动效果（定时器的用应）

   
   

 

关联事件（双击）