动态脚本
function loadScript(url){
var script = document.createElement("script");
script.type = "text/javascript";
script.src=url;
document.body.appendChild(script);
}
loadSript("client.js");
动态样式
function loadCSS(url){
var link = document.createElement("link");
link.rel="stylesheet";
link.type="text/css";
link.href=url;
var head = document.getElementByTagName("head")[0];
head.appendChild(link);
}
loadCSS("style.css");
DOM选择符API
querySelector(接收css选择符)
----通过document调用会在文档范围内查找---通过Element类型调用 在改元素后代元素在查找,
----返回的都是匹配的第一个元素没有返回null
querySelectorAll(接收css选择符)
----通过document调用会在文档范围内查找---通过Element类型调用 在改元素后代元素在查找,
----返回的都是匹配的所有元素没有返回null
matchedSelector()---有匹配返回true,没有匹配返回false
var body = document.querySelector("body");
var myDiv = document.querySelector("#myDiv");
var myDiv = document.querySelector(".myDiv");
var myDiv = document.querySelector("img .button");
DOM元素遍历---DOM的5个属性
childElementCount
firstElementChild:
lastElementChild:
previousElementSibling:
nextElementSibling
document.activeElement属性始终会引用DOM中当前获得了焦点的元素
document.readState属性有两个可能值loading 和complete
document.compat ----获取渲染模式CSS1Compat :标准模式 BackCompat:混杂模式
document.head获取<head>元素
document.charset
动态操作:插入、替换
innerHTML ---插入标记
innerText----插入文本
滚动
scrollIntoView()方法--可以在所有HTML元素上调用
document.forms[0].scrollIntoView()