DOM操作

DOM节点

DOM方法

getElementById()方法返回带有指定ID的元素

• getElementById(id) - 获取带有指定 id 的节点（元素）
• appendChild(node) - 插入新的子节点（元素）
• removeChild(node) - 删除子节点（元素）

getElementById()	返回带有指定 ID 的元素。
getElementsByTagName()	返回包含带有指定标签名称的所有元素的节点列表（集合/节点数组）。
getElementsByClassName()	返回包含带有指定类名的所有元素的节点列表。
appendChild()	把新的子节点添加到指定节点。
removeChild()	删除子节点。
replaceChild()	替换子节点。
insertBefore()	在指定的子节点前面插入新的子节点。
createAttribute()	创建属性节点。
createElement()	创建元素节点。
createTextNode()	创建文本节点。
getAttribute()	返回指定的属性值。
setAttribute()	把指定属性设置或修改为指定的值。

DOM属性

• innerHTML - 节点（元素）的文本值
• parentNode - 节点（元素）的父节点
• childNodes - 节点（元素）的子节点
• attributes - 节点（元素）的属性节点

DOM访问

• 通过使用 getElementById() 方法
• 通过使用 getElementsByTagName() 方法
• 通过使用 getElementsByClassName() 方法

DOM修改

• 改变 HTML 内容
• 改变 CSS 样式
• 改变 HTML 属性
• 创建新的 HTML 元素
• 删除已有的 HTML 元素
• 改变事件（处理程序

DOM元素

DOM事件

DOM导航

DOM总结

BOM操作

content: function () {
                            'step 0'
                            var dialog = ui.create.dialog()
                            dialog.id = 'rgxdialog'
                            dialog.classList.add('fixed');
                            dialog.classList.add('noupdate')
                            dialog.classList.add('scroll1');
                            dialog.classList.add('scroll2');
                            dialog.classList.add('center');
                            dialog.classList.add('scroll3');
                            dialog.style.height='58%'
                            dialog.style.left='25%'
                            dialog.style.width='50%'
                            dialog.style.padding=0
                            var dialogA = document.getElementById('rgxdialog')
                            // 获取dialog的高
                            // var dialogH = window.getComputedStyle(dialogA).height
                            // var dialogH=dialogA.style.height
                            // 获取dialog的宽,使用window.getComputedStyle(dialogA).width/height获得实时style属性
                            // var dialogW = window.getComputedStyle(dialogA).width
                            // var dialogW=dialogA.style.width
                            //有N行
                            var row = 3
                            //有M列
                            var col = 3
                             // 盒子的padding
                            var boxP=4
                            //盒子的border
                            var boxB=0
                            //盒子的高度，固定
                            // var boxH = parseInt(dialogH.substring(0,dialogH.length-2))/ row-row*2*(boxP+boxB)
                            // 盒子的宽度，固定
                            // var boxW = parseInt(dialogW.substring(0,dialogW.length-2)) / col-col*2*(boxP+boxB)
                            for (var i = 0; i <col; i++) {
                                for (var j = 0; j <row; j++) {
                                    //遍历然后添加box
                                    var box = document.createElement('div')
                                    box.innerHTML = '盒子' + i+j
                                    box.style.border = boxB+'px'
                                    //盒子的高
                                    box.style.height = 100/col+'%'
                                    //盒子的宽度
                                    box.style.width = 100/row+'%'
                                    //盒子的顶部(i*boxH)+((1+2*i)*boxP+(1+2*i)*boxB)+'px'
                                    box.style.top =(i*(100/row))+'%'
                                    //盒子的左(j * boxW) +((1+2*j)*boxP+(1+2*j)*boxB)+ 'px'
                                    box.style.left = (j*(100/col))+'%'
                                    box.style.padding =boxP+'px'
                                    box.style.color='red'
                                    // box.style.display='flex'
                                    box.id='box'+i+j
                                    dialog.appendChild(box)
                                }

                            }



                            player.chooseButton(dialog)





                        },

chooseButton(dialog)写法

加一张虚拟卡牌或一张武将牌

var dialog = ui.create.dialog()

             var card = [['cisha'], 'vcard']

             var character=[['guanyu'],'character']

              dialog.add(card)

             dialog.add(character)

              player.chooseButton(dialog)

//下一个step 检测
function rgx_a(x) {
                                var k = 0;
                                for (i in x) {
                                    game.log(k, i, x[i]);
                                    k++;
                                }
                            }
                            function rgx_b(x) {
                                var k = 0;
                                for (i in x) {
                                    game.log(k, i);
                                    k++;
                                }
                            }
                            rgx_a(result)

what fuck	说明	栗子
buttons		HTMLDivElement对象
cards
targets
confirm	确定
bool	true/false
links	你选择的玩意

vcard

character

precharacter

characterx