资讯专栏INFORMATION COLUMN

w3school容易忽略的东西

shadowbook / 3343人阅读

摘要:和事件可用于处理。循环中的代码块将针对每个属性执行一次。返回值是被找到的值。是被视为节点树的。将新元素作为父元素的最后一个子元素进行添加。返回指定的属性值。把指定属性设置或修改为指定的值。年龄必须是与之间的数字。

JS JS DOM

onload 和 onunload 事件会在用户进入或离开页面时被触发。
onload 事件可用于检测访问者的浏览器类型和浏览器版本,并基于这些信息来加载网页的正确版本。
onload 和 onunload 事件可用于处理 cookie。

onmousedown, onmouseup 以及 onclick 构成了鼠标点击事件的所有部分。首先当点击鼠标按钮时,会触发 onmousedown 事件,当释放鼠标按钮时,会触发 onmouseup 事件,最后,当完成鼠标点击时,会触发 onclick 事件。

找到您希望删除的子元素,然后使用其 parentNode 属性来找到父元素:

var child=document.getElementById("p1");
child.parentNode.removeChild(child);
JS 对象

JavaScript for...in 语句循环遍历对象的属性。
for...in 循环中的代码块将针对每个属性执行一次。

for (对象中的变量)
  {
  要执行的代码
  }

极大或极小的数字可通过科学(指数)计数法来写:

var y=123e5;    // 12300000
var z=123e-5;   // 0.00123

如果逻辑对象无初始值或者其值为 0、-0、null、""、false、undefined 或者 NaN,那么对象的值为 false。否则,其值为 true(即使当自变量为字符串 "false" 时)!

使用了 Math 对象的 floor() 方法和 random() 来返回一个介于 0 和 10 之间的随机数:

document.write(Math.floor(Math.random()*11)) 
RegExp 对象的方法

test() 方法检索字符串中的指定值。返回值是 true 或 false。

exec() 方法检索字符串中的指定值。返回值是被找到的值。如果没有发现匹配,则返回 null。

//找到第一个 "e",并存储其位置,
//如果再次运行 exec(),则从存储的位置开始检索,并找到下一个 "e",并存储其位置
var patt1=new RegExp("e","g");
do
{
result=patt1.exec("The best things in life are free");
document.write(result);
}
while (result!=null) 

compile() 既可以改变检索模式,也可以添加或删除第二个参数。

var patt1=new RegExp("e");
document.write(patt1.test("The best things in life are free")); //true
patt1.compile("d");
document.write(patt1.test("The best things in life are free")); //false
JS Window Window 尺寸

有三种方法能够确定浏览器窗口的尺寸(浏览器的视口,不包括工具栏和滚动条)。

对于Internet Explorer、Chrome、Firefox、Opera 以及 Safari:

window.innerHeight - 浏览器窗口的内部高度
window.innerWidth - 浏览器窗口的内部宽度

对于 Internet Explorer 8、7、6、5:

document.documentElement.clientHeight
document.documentElement.clientWidth
或者
document.body.clientHeight
document.body.clientWidth

实用的 JavaScript 方案(涵盖所有浏览器):

var w=window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;

var h=window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;


Window Screen

(返回访问者屏幕的宽度,以像素计,减去界面特性,比如窗口任务栏)

screen.availWidth - 可用的屏幕宽度

screen.availHeight - 可用的屏幕高度

Window Location

location.href 属性返回当前页面的 URL。
location.hostname 返回 web 主机的域名
location.pathname 返回当前页面的路径和文件名
location.port 返回 web 主机的端口 (80 或 443)
location.protocol 返回所使用的 web 协议(http:// 或 https://)
location.assign("http://www.w3school.com.cn") 方法加载新的文档。

window.history

history.back() - 与在浏览器点击后退按钮相同(加载历史列表中的前一个 URL)
history.forward() - 与在浏览器中点击按钮向前相同(加载历史列表中的下一个 URL)

window.navigator

(navigator 数据可被浏览器使用者更改,浏览器无法报告晚于浏览器发布的新操作系统)

特性检测
由于 navigator 可误导浏览器检测,使用对象检测可用来嗅探不同的浏览器。
由于不同的浏览器支持不同的对象,您可以使用对象来检测浏览器。例如,由于只有 Opera 支持属性 "window.opera",您可以据此识别出 Opera。

window.PopupAlert
alert("文本")
confirm("文本")
prompt("文本","默认值")
JS Timing

setTimeout("javascript语句",毫秒) 未来的某时执行代码
setTimeout() 方法会返回某个值。在上面的语句中,值被储存在名为 t 的变量中。假如你希望取消这个 setTimeout(),你可以使用这个变量名来指定它。
clearTimeout() 取消setTimeout()

JS Cookies









HTML DOM

在 HTML DOM 中,所有事物都是节点。DOM 是被视为节点树的 HTML。

整个文档是一个文档节点
每个 HTML 元素是元素节点
HTML 元素内的文本是文本节点
每个 HTML 属性是属性节点
注释是注释节点

document.documentElement - 全部文档
document.body - 文档的主体


DOM 处理中的常见错误是希望元素节点包含文本
可通过节点的 innerHTML 属性来访问文本节点的值

一些常用的 HTML DOM 方法:
getElementById() 返回带有指定 ID 的元素。
getElementsByTagName() 返回包含带有指定标签名称的所有元素的节点列表(集合/节点数组)。
getElementsByClassName() 返回包含带有指定类名的所有元素的节点列表。
appendChild() 将新元素作为父元素的最后一个子元素进行添加。
removeChild() 删除子节点child.parentNode.removeChild(child)。
replaceChild() 替换子节点。
insertBefore() 在指定的子节点前面插入新的子节点。
createAttribute() 创建属性节点。
createElement() 创建元素节点。
createTextNode() 创建文本节点。
getAttribute() 返回指定的属性值。
setAttribute() 把指定属性设置或修改为指定的值。
一些常用的 HTML DOM 属性:
innerHTML - 节点(元素)的文本值
parentNode - 节点(元素)的父节点
childNodes - 节点(元素)的子节点
attributes - 节点(元素)的属性节点

nodeName 属性
nodeName 属性规定节点的名称。
nodeName 是只读的
元素节点的 nodeName 与标签名相同
属性节点的 nodeName 与属性名相同
文本节点的 nodeName 始终是 #text
文档节点的 nodeName 始终是 #document
注释:nodeName 始终包含 HTML 元素的大写字母标签名。

nodeValue 属性
nodeValue 属性规定节点的值。
元素节点的 nodeValue 是 undefined 或 null
文本节点的 nodeValue 是文本本身
属性节点的 nodeValue 是属性值

nodeType 属性
nodeType 属性返回节点的类型。nodeType 是只读的。
比较重要的节点类型有:
元素类型 NodeType
元素 1
属性 2
文本 3
注释 8
文档 9

如需向 HTML DOM 添加新元素,您首先必须创建该元素(元素节点),然后把它追加到已有的元素上。

除了 innerHTML 属性,您也可以使用 childNodes 和 nodeValue 属性来获取元素的内容。
document.getElementById("intro").childNodes[0].nodeValue

向超链接添加快捷键
几乎所有浏览器均 accesskey 属性,除了 Opera。
以下元素支持 accesskey 属性:
< a>, ,