HTML 学习笔记 May 13，2017 js事件驱动机制、js事件分类、js访问css技术、js事件驱动机制深入理解、js常用事件、js版计算器、dom编程开山篇、dom编程实例（乌龟抓鸡）、

HTML 学习笔记 May 13，2017 js事件驱动机制、js事件分类、js访问css技术、js事件驱动机制深入理解、js常用事件、js版计算器、dom编程开山篇、dom编程实例（乌龟抓鸡）、

js 中
document.onmousedown = function(){alert('0');} // 加入这句的话,点击鼠标就能响应事件

js 操作外部 css

div1

直接获取到 css 里边所有的 class 选择器，方法会根据浏览器的不同而略有不同。
function test2(eventObj) {
// 获取 css 文件中的所有 class 选择器
var ocssRules = document.styleSheets[0].rules;

}

到底使用的是哪个浏览器呢，下边是判断几种常见的浏览器

if (window.XMLHttpRequest) { // Mozilla, Safari, IE7,IE8 Mozilla就是火狐(其实是网景公布开源内核)
if (!window.ActiveXObject) { // Mozilla, Safari,
alert('Mozilla,Safari');
} else {
alert('IE');
}
} else {
alert('IE6');
}

不让用户点击右键，以防拷贝网页内容

可以写成下面的
// 响应 test5 的方法

js 更重要的作用是可以让用户对网页元素进行交互操作，这才是学习 js 的精华之所在。

// 响应用户点击按钮,或者是按下键盘
function move(obj) {

// 得到乌龟图片的高度和宽度
var wugui_height = 67;
var wugui_width = 94;

// 公鸡的图片的高度和宽度
var cock_height = 73;
var cock_width = 76;

// 得到乌龟所在的 div 对象[这里就提现了 dom 特色]
var wugui = document.getElementById("wugui");

// window.event 可以判断用户是通过点击按钮,还是通过键盘来控制乌龟
if (window.event) {
    // 获得用户按下键的 code
    key = obj.keyCode;
}

// 得到该乌龟当前的 top 和 left
var wugui_top = wugui.style.top;
// 处理 px 后缀
var wugui_left = wugui.style.left;

// 下面两句话是把获取的 "100px" --> 100
wugui_top = parseInt(wugui_top.substring(0,wugui_top.indexOf("p")));
wugui_left = parseInt(wugui_left.substring(0,wugui_left.indexOf("p")));
// window.alert(wugui_top);
// 判断用户点击哪个按钮
if (obj.value = "向下走" || key == 83) {
    wugui.style.top = (wugui_top + 10) + "px";
    wugui_top = wugui_top + 10;
} else if (obj.value == "向右走" || key == 68) {
    wugui.style.left = (wugui_left + 10) + "px";
    wugui_left = wugui_left + 10;
} else if (obj.value == "向左走" || key == 65) {
    wugui.style.left = (wugui_left - 10) + "px";
    wugui_left = wugui_left - 10;
} else if (obj.value == "向上走" || key == 87) {
    wugui.style.top = (wugui_top - 10) + "px";
    wugui_top = wugui_top - 10;
}

// 判断乌龟是否碰到鸡
// 得到公鸡的 left 和 top
var cock = document.getElementById("cock");

// 得到该公鸡当前的 top 和 left
var cock_top = cock.style.top;
// 处理 px 后缀
var cock_left = cock.style.left;
cock_top = parseInt(cock_top.substring(0,cock_top.indexOf("p")));
cock_left = parseInt(cock_left.substring(0,cock_left.indexOf("p")));

y = Math.abs(cock_top - wugui_top); // 两点间纵坐标的绝对值
x = Math.abs(cock_left - wugui_left); // 两点间横坐标的绝对值

// 方法一

// 判断条件
xx = 0;
yy = 0;
// 判断纵向
if (wugui_top < cock_top) {
    if (y < wugui_height) {
        yy = 1;
    }
} else {
    if (y < cock_height) {
        yy = 1;
    }
}

// 判断横向
if (wugui_left < cock_left) {
    if (x < wugui_width) {
        xx = 1;
    }
} else {
    if (x < cock_width) {
        xx = 1;
    }
}

if (xx == 1 && yy == 1) {
    window.alert("乌龟好猛啊,顶！d=====(￣▽￣*)b");
    wugui.style.top = 120 + "px";
    wugui.style.left = 100 + "px";
}

// 方法二
// 从上面来的
if (wugui_top < cock_top)
{
    // 左
    if (wugui_left < cock_left)
    {
       if (y < wugui_height && x < wugui_width)
       {
           window.alert("乌龟好猛啊,顶！d=====(￣▽￣*)b");
           wugui.style.top = 120 + "px";
           wugui.style.left = 100 + "px";
       }
    }
    // 右
    else if (y < wugui_height && x < cock_width)
    {
        window.alert("乌龟好猛啊,顶！d=====(￣▽￣*)b");
        wugui.style.top = 120 + "px";
        wugui.style.left = 100 + "px";
    }
}
// 从下面来的
else