大橙子网站建设,新征程启航
为企业提供网站建设、域名注册、服务器等服务
这就是树状结构的最基本特征啊,树干生出树枝,树枝再生出树叶,反过来,每片树叶都是从某条树枝上长出来的,而每条树枝也是从树干上长出来的,如果把树叶、树枝都看作节点,那么每个节点都是有父节点的,唯一例外就是最顶层的那个节点(树干)是没有父节点的。
成都创新互联公司专业IDC数据服务器托管提供商,专业提供成都服务器托管,服务器租用,成都天府联通服务器托管,成都天府联通服务器托管,成都多线服务器托管等服务器托管服务。
最简单的方法就是用元素的innerHTML属性赋值,如:myNewElement.innerHTML = “我是文本”;但这样不能清晰的体现DOM中新增加了一个文本节点。
然后另一种添加文本节点的方式,可分为两步:
1、创建节点:文本节点的创建使用createTextNode方法,如:var myText = document.createTextNode(“我是文本”);
2、将创建的节点用appendChild方法添加某个元素下。如:myNewElement.appendChild(myText);这样myNewElement就有myText的文本节点,文本节点的内容是“我是文本”即可。
获取属性节点
第一种方法:获取官方定义的属性节点(获取元素的对应属性值)。
格式:元素节点,属性名。
注意:不能获取自定义属性的值。
代码如下:
console.log(jsInput.placeholder);
alert("是时候展现真正的技术");
设置属性节点的值
公式:元素节点 . 属性名 = 新的属性值
代码如下:
//设置元素对应属性的值
//元素节点.属性名 = 新的属性值
jsInput.placeholder = "sunck good";
第二种方法
公式:元素节点 . getAttribute(属性名);
注意:还可以获取自定义属性的值。
代码:
console.log(jsInput.getAttribute("my"));
设置自定属性的值
公式:元素节点 . setAttribute(属性名, 新属性值);
注意:当属性不存在时,变为添加属性
代码:
//设置
//元素节点.setAttribute(属性名, 新属性值);
jsInput.setAttribute("my", "sunck");
//注意:当属性不存在时,变为添加属性
jsInput.setAttribute("other", "sunck");
删除属性节点
公式:元素节点.removeAttribute(属性名);
注意:某些低版本浏览器不支持
代码:
jsInput.removeAttribute("other");
console.log(jsInput);
一般地,节点至少拥有nodeType、nodeName和nodeValue这三个基本属性。
节点类型不同,这三个属性的值也不相同
nodeType
nodeType属性返回节点类型的常数值。不同的类型对应不同的常数值,12种类型分别对应1到12的常数值
元素节点 Node.ELEMENT_NODE(1)
属性节点 Node.ATTRIBUTE_NODE(2)
文本节点 Node.TEXT_NODE(3)
CDATA节点 Node.CDATA_SECTION_NODE(4)
实体引用名称节点 Node.ENTRY_REFERENCE_NODE(5)
实体名称节点 Node.ENTITY_NODE(6)
处理指令节点 Node.PROCESSING_INSTRUCTION_NODE(7)
注释节点 Node.COMMENT_NODE(8)
文档节点 Node.DOCUMENT_NODE(9)
文档类型节点 Node.DOCUMENT_TYPE_NODE(10)
文档片段节点 Node.DOCUMENT_FRAGMENT_NODE(11)
DTD声明节点 Node.NOTATION_NODE(12)
DOM定义了一个Node接口,这个接口在javascript中是作为Node类型实现的,而在IE8-浏览器中的所有DOM对象都是以COM对象的形式实现的。所以,IE8-浏览器并不支持Node对象的写法
1、所谓元素,即html文档里面,所有的标签都可以称之为元素,比如说p、tr等,也就是说元素是个统称,一个文档里面有很多的元素。
2、所谓节点,是js为了对html文档进行操作,而开发的,即DOM,文档对象模型。即每个元素都可以称之为一个节点,节点是唯一的。
比方来说,《p》标签,肯定是一个p标签元素,那如果通过js对它进行样式控制的时候,就必须获取(找到)到这个元素,称之为节点,如果有好多元素,可以获得第1个、第2个或者第n个。
总之,元素是统称,节点是具有唯一性的。
1、JavaScript原生函数没有提供判断DOM节点是否存在方法,我们通常获取DOM节点几乎都是document.getElement..方法,会返回一个object数组合集,我们可以通过object[0],object[1]这样来访问这个合集的每一个对象。既然返回的是数组合集,那么就有length属性,而length大于等于1即表示DOM节点存在页面中
代码:
Object.prototype.exist = function(){
if(typeof this !='undefined' this.length=1){
return true;
}
return false;
};
使用:
假设页面有如下节点
div这里是DIV节点/div
div这里是DIV节点/div
span这里是span节点/span
判断节点是否在页面:
var is_exist = document.getElementsByTagName('div').exist();
alert(is_exist); // true
var is_exist = document.getElementsByTagName('span').exist();
alert(is_exist); // true
var is_exist = document.getElementsByTagName('p').exist();
alert(is_exist); // false
2、注意:如果使用是使用document.getElementById()方法获取对象的就不能使用exist()方法,因为根据ID取节点对象的方法在取不到节点的情况下会返回一个空对象,不会集成原型exist()函数,所以会报错!所以如果是根据ID取对象的可以直接if(obj)这样既可判断DOM节点是否存在页面中
jQuery判断DOM节点是否存在页面中
可以这么干
添加原型:
(function($) {
$.fn.exist = function(){
if($(this).length=1){
return true;
}
return false;
};
})(jQuery);
3、使用方法:
假如页面有如下DOM节点
div id="a"这里是id=a节点/div
div这里是DIV节点/div
div这里是DIV节点/div
span这里是span节点/span
判断:
alert($('#aaa').exist()); // false
alert($('#a').exist()); // true
alert($('div').exist()); // true
alert($('p').exist()); // false
以上两种方法其实都是根据对象集合的length属性判断对象是否存在。