[javascript]Dom操作笔记

1.为一个节点同时设置多个属性

$("div[aria-describedby='F53_batch_history']").attr({"display":"none","position":"absolute")

//[div.ui-draggable.ui-resizable.ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-front.wijmo-wijdialog]

2.同时取得一个节点的多个css值

$("div[aria-describedby='F53_batch_history']").css(["display","position"])//Object {display: "block", position: "absolute"}

//Object=>Json

JSON.stringify($("div[aria-describedby='F53_batch_history']").css(["display","position"]))//"{"display":"block","position":"absolute"}"

3.为一个节点同时设置多个css

$("div[aria-describedby='F53_batch_history']").css({"display":"none","position":"absolute"})

//[div.ui-draggable.ui-resizable.ui-dialog.ui-widget.ui-widget-content.ui-corner-all.ui-front.wijmo-wijdialog]

4.css()等方法可以传入回调函数赋值

$("div[aria-describedby='F53_batch_history']").css("display",function(nodeIndex, oldValue){if (nodeIndex==0){return "none"};})

5.切换toggle(),toggleClass()

toggle() :切换元素的可见状态。

如果被选元素可见，则隐藏这些元素，如果被选元素隐藏，则显示这些元素。

toggleClass():切换class是否添加

如果class已经存在，则删除class，如果class不存在，则添加

6.unwrap(),wrapInner(),wrap(),wrapAll()

6.1unwrap():删除被选元素的父元素。

 <article>

   <div>

    <p>test</p>

   </div>

  </article>

执行$(p).unwrap()后：

<article>

   <p>test</p>

</article>

6.2wrapInner():在元素内容插入包裹元素；

<div>

   <p>test</p>

</div>

执行$(p).wrapInner(<b></b>)后：

<div>

   <p> <b>test</b> </p>

</div>

6.3wrap()：在每个元素外插入包裹元素；

<p>test</p>

<p>test2</p>

执行$(p).wrap(<div></div>)后：

  <div>

   <p>test</p>

  </div>

  <div>

   <p>test2</p>

  </div>

6.4wrapAll()：在所有元素外插入包裹元素；

<p>test</p>

<p>test2</p>

执行$(p).wrap(<div></div>)后：

<div>

   <p>test</p>

   <p>test2</p>

</div>

7.clone(includeEvents)

clone() ：复制元素

includeEvents：规定是否复制元素的所有事件处理，默认为false

巴特西

[javascript]Dom操作笔记

最新文章

热门文章