KindEditor/Node API：修訂間差異

• K(expr , root)

創(chuàng)建或選取KNode對(duì)象，KNode是原生node的封裝，KNode對(duì)象擁有以下屬性和方法。

參數(shù):

1. string|node expr: DOM元素、選擇器表達(dá)式、HTML代碼
2. element root: DOM根元素，在root范圍內(nèi)選擇DOM元素

返回: KNode

示例:

node = K('<div>abc</div>');
node = K('#id div');
node = K(document.getElementById('id'));
firstNode = node[0];

• length

node數(shù)量

var length = K('#id div').length;

• doc

第一個(gè)node的document對(duì)象。

var doc = K('#id div').doc;

• name

第一個(gè)node的nodeName。

• type

第一個(gè)node的nodeType。1: Element, 3: textNode

• bind(type , fn)

將指定函數(shù)綁定到所有KNode的指定事件上。

參數(shù):

1. string type: 事件類型
2. function fn: 回調(diào)函數(shù)

返回: KNode

示例:

K('#id div').bind('click', function() {
        alert(this.nodeName + ': clicked');
});
K('#id div').click(function() {
        alert(this.nodeName + ': clicked');
});

• unbind([type , fn])

移除已綁定的事件函數(shù)。

參數(shù):

1. string type: 事件類型
2. function fn: 回調(diào)函數(shù)

返回: KNode

示例:

K('#id').unbind('click', functionName); //移除指定的事件函數(shù)
K('#id').unbind('click'); //移除所有click事件函數(shù)
K('#id').unbind(); //移除所有事件函數(shù)

• fire(type)

執(zhí)行綁定在第一個(gè)node上的事件函數(shù)。

參數(shù):

string type: 事件類型

返回: KNode

示例:

K('#id').fire('click');
K.click();

• hasAttr(key)

判斷第一個(gè)node是否擁有指定屬性。

參數(shù):

string key: 屬性名

返回: boolean

示例:

var bool = K('#id').hasAttr('border');

• attr()

取得第一個(gè)node的所有屬性.

參數(shù): 無； 返回: object

示例:

var attrList = K('#id').attr(); //return key-value data

• attr(key)

取得第一個(gè)node的指定屬性.

參數(shù):

string key: 屬性名

返回: string

示例:

var border = K('#id').attr('border');

• attr(key, val)

設(shè)置所有node的屬性。

參數(shù):

1. string key: 屬性名
2. string val: 屬性值

返回: KNode

示例:

K('#id img').attr('border', 1);

• attr(obj)

設(shè)置所有node的多個(gè)屬性。

參數(shù):

object obj: key-value數(shù)組

返回: KNode

示例:

K('#id img').attr({
        'width' => '100px',
        'border' => 1
});

• removeAttr(key)

移除所有node的指定屬性.

參數(shù):

string key: 屬性名

返回: KNode

示例:

K('#id img').removeAttr('border');

• get([i])

取得原生node，當(dāng)KNode的length為0時(shí)，返回null.

參數(shù):

int i: offset，默認(rèn)值為0

返回: node

示例:

div1 = K('#id div').get(0);
div2 = K('#id div').get(1);

• hasClass(cls)

判斷第一個(gè)node是否擁有指定class。

參數(shù):

string cls: className

返回: boolean

示例:

var bool = K('#id').hasClass('class-name');

• addClass(cls)

將指定className添加到所有node。

參數(shù):

string cls: className

返回: KNode

示例:

K('#id').addClass('class-name');

• removeClass(cls)

移除所有node上的指定className。

參數(shù):

string cls: className

返回: KNode

示例:

K('#id').removeClass('class-name');

• html()

取得第一個(gè)node的innerHTML。

參數(shù): 無； 返回: string

示例:

K('#id').html(val);

• html(val)

設(shè)置所有node的innerHTML。

參數(shù):

string val: HTML字符串

返回: KNode

示例:

K('#id').html('<strong>abc</strong>');

• hasVal()

判斷第一個(gè)node是否擁有value屬性。

參數(shù): 無； 返回: boolean

示例:

bool = K('#textarea').hasVal(); //return true
bool = K('#div').hasVal(); //return false

• val()

取得第一個(gè)node的value。

參數(shù): 無；返回: string

示例:

var value = K('#textarea').val();

• val(val)

設(shè)置所有node的value。

參數(shù): 無； 返回: KNode

示例:

K('#textarea').val('abc');

• css()

取得第一個(gè)node的所有CSS.

參數(shù): 無； 返回: object

示例:

var cssList = K('#id').css(); //return key-value data

• css(key)

取得第一個(gè)node的指定CSS.

參數(shù):

string key: CSS key

返回: string

示例:

var padding = K('#id').css('padding');

• css(key, val)

設(shè)置所有node的CSS。

參數(shù):

1. string key: CSS key
2. string val: CSS value

返回: KNode

示例:

K('#id div').css('border', '1px solid #000');

• css(obj)

設(shè)置所有node的多個(gè)CSS。

參數(shù):

object obj: key-value數(shù)組

返回: KNode

示例:

K('#id div').css({
        'width' => '100px',
        'height' => '50px',
        'padding' => '10px'
});

參考來源

• http://www.kindsoft.net/doc.php

KindEditor使用手冊(cè)導(dǎo)航
使用方法 初始化參數(shù) 添加自定義插件 API文檔： 基礎(chǔ)API|事件API|選擇器API|Node API|Range API|Command API|Ajax API|其它幾種API 常見問題