浅谈js中的Insertion对象

首先，这个对象是其他类似功能的根。它没有任何属性和方法。在这个对象中定义的类仍然可以被视为传统的抽象类。

1：Insertion.Before 类：在给定元素开始标记的前面插入HTML。
下面的代码

<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span>

<script> new Insertion.Before('person', 'Chief '); </script>

将把 HTML 变为

<br>Hello, Chief <span id="person" style="color:red;">Wiggum. How's it going?</span>

2：Insertion.Top 类：在给定元素第一个子节点位置插入 HTML。内容将位于元素的开始标记的紧后面。
下面的代码

<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span>

<script> new Insertion.Top('person', 'Mr. '); </script>

将把 HTML 变为

<br>Hello, <span id="person" style="color:red;">Mr. Wiggum. How's it going?</span>

3：Insertion.Bottom 类：在给定元素最后一个子节点位置插入 HTML。内容将位于元素的结束标记的紧

前面。
下面的代码

<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span>

<script> new Insertion.Bottom('person', " What's up?"); </script>

将把 HTML 变为

<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going? What's up?</span>
4：Insertion.After 类：在给定元素结束标记的后面插入HTML。
下面的代码

<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span>

<script> new Insertion.After('person', ' Are you there?'); </script>

将把 HTML 变为

<br>Hello, <span id="person" style="color:red;">Wiggum. How's it going?</span> Are you

there?

  但是如果你的对象节点是select的话，那么在Ie下用这些方法或者innerHTML操作都是不行的，具体实现方法看宗老师的文

章：Ie的select操作问题



标签: Insertion , javascript