一般常用的原生选择器有:
id选择器:document.getElementById("test")
name选择器:document.getElementsByName("test")
节点选择器:document.getElementsByTagName("p")
class选择器:document.getElementsByClassName("test")
这次要详细说的是 document.querySelector() , 开挂般的存在, jQuery的完美替代版本。
接收一个字符串参数, 返回返文档中与指定选择器或选择器组匹配的第一个 HTMLElement 对象。 如果找不到匹配项,则返回 null 。
3.返回带有foo或者bar样式类的首个元素
4.返回id为‘my-element’的 p 元素
6.其他选择方式可自行排列组合
document.querySelector() 的用法虽然与jQuery里的$()选择器类似,但有些细微区别:
首先js是不大可能控制选项卡的,再说每种浏览器也都有不一样的选项卡模式,你通过api去实现不太可能。你可以转换思路,不要用真正的选项卡,而是自己写一个类似于选项卡的页面,可以点击切换页面等等。点击切换选项卡或提交按钮时ajax加载你想要的内容就可以了。
1.在页面加载之后使用js解析url地址,读取里面的id值函数我这里有一个:
function GetQueryStringItem(priStrQueryName, queryString) {
if (queryString == null) {
queryString = this.location.search
}
priStrValue = ""
priIsFound = false
if (queryString.indexOf("?") == 0 &&queryString.indexOf("=") >1) {
priArraySource = unescape(queryString).substring(1, queryString.length).split("&")
priGetQSi = 0
while (priGetQSi <priArraySource.length &&!priIsFound) {
if (priArraySource[priGetQSi].indexOf("=") >0) {
if (priArraySource[priGetQSi].split("=")[0].toLowerCase() == priStrQueryName.toLowerCase()) {
priStrValue = priArraySource[priGetQSi].split("=")[1]
priIsFound = true
}
}
priGetQSi++
}
}
if (priStrValue == undefined) {
priStrValue = ""
}
return priStrValue
}
var id=GetQueryStringItem("id",location.href)
2. 根据id值切换到指定的选项卡:
delayChangeTab(id,500)