Vue获取elementtable单元格的内容（[objectHTMLTableCellE。。。vue中通过点击表格单元格获取单元格内容，取出innerHTML，并在dom中显⽰
1.了解Command（）=====
execCommand⽅法是执⾏⼀个对当前⽂档/当前选择/给出范围的命令。
2D-Position 允许通过拖曳移动绝对定位的对象。
AbsolutePosition 设定元素的 position 属性为“absolute”(绝对)。
BackColor 设置或获取当前选中区的背景颜⾊。
BlockDirLTR ⽬前尚未⽀持。
BlockDirRTL ⽬前尚未⽀持。
Bold 切换当前选中区的粗体显⽰与否。
BrowseMode ⽬前尚未⽀持。
Copy 将当前选中区复制到剪贴板。
CreateBookmark 创建⼀个书签锚或获取当前选中区或插⼊点的书签锚的名称。
CreateLink 在当前选中区上插⼊超级链接，或显⽰⼀个对话框允许⽤户指定要为当前选中区插⼊的超级链接的 URL。
Cut 将当前选中区复制到剪贴板并删除之。
Delete 删除当前选中区。
DirLTR ⽬前尚未⽀持。
DirRTL ⽬前尚未⽀持。
EditMode ⽬前尚未⽀持。
FontName 设置或获取当前选中区的字体。
FontSize 设置或获取当前选中区的字体⼤⼩。
ForeColor 设置或获取当前选中区的前景(⽂本)颜⾊。
FormatBlock 设置当前块格式化标签。
Indent 增加选中⽂本的缩进。
InlineDirLTR ⽬前尚未⽀持。
InlineDirRTL ⽬前尚未⽀持。
InsertButton ⽤按钮控件覆盖当前选中区。
InsertFieldset ⽤⽅框覆盖当前选中区。
InsertHorizontalRule ⽤⽔平线覆盖当前选中区。
InsertIFrame ⽤内嵌框架覆盖当前选中区。
InsertImage ⽤图像覆盖当前选中区。
InsertInputButton ⽤按钮控件覆盖当前选中区。
InsertInputCheckbox ⽤复选框控件覆盖当前选中区。
InsertInputFileUpload ⽤⽂件上载控件覆盖当前选中区。html document是什么
InsertInputHidden 插⼊隐藏控件覆盖当前选中区。
InsertInputImage ⽤图像控件覆盖当前选中区。
InsertInputPassword ⽤密码控件覆盖当前选中区。
InsertInputRadio ⽤单选钮控件覆盖当前选中区。
InsertInputReset ⽤重置控件覆盖当前选中区。
InsertInputSubmit ⽤提交控件覆盖当前选中区。
InsertInputText ⽤⽂本控件覆盖当前选中区。
InsertMarquee ⽤空字幕覆盖当前选中区。
InsertOrderedList 切换当前选中区是编号列表还是常规格式化块。
InsertParagraph ⽤换⾏覆盖当前选中区。
InsertSelectDropdown ⽤下拉框控件覆盖当前选中区。
InsertSelectListbox ⽤列表框控件覆盖当前选中区。
InsertTextArea ⽤多⾏⽂本输⼊控件覆盖当前选中区。
InsertUnorderedList 切换当前选中区是项⽬符号列表还是常规格式化块。
Italic 切换当前选中区斜体显⽰与否。
JustifyCenter 将当前选中区在所在格式化块置中。
JustifyFull ⽬前尚未⽀持。
JustifyLeft 将当前选中区所在格式化块左对齐。
JustifyNone ⽬前尚未⽀持。
JustifyRight 将当前选中区所在格式化块右对齐。
LiveResize 迫使 MSHTML 编辑器在缩放或移动过程中持续更新元素外观，⽽不是只在移动或缩放完成后更新。
MultipleSelection 允许当⽤户按住 Shift 或 Ctrl 键时⼀次选中多于⼀个站点可选元素。
Open 打开。
Outdent 减少选中区所在格式化块的缩进。
OverWrite 切换⽂本状态的插⼊和覆盖。
Paste ⽤剪贴板内容覆盖当前选中区。
Paste ⽤剪贴板内容覆盖当前选中区。
PlayImage ⽬前尚未⽀持。
Print 打开打印对话框以便⽤户可以打印当前页。
Redo 重做。
Refresh 刷新当前⽂档。
RemoveFormat 从当前选中区中删除格式化标签。
RemoveParaFormat ⽬前尚未⽀持。
SaveAs 将当前 Web 页⾯保存为⽂件。
SelectAll 选中整个⽂档。
SizeToControl ⽬前尚未⽀持。
SizeToControlHeight ⽬前尚未⽀持。
SizeToControlWidth ⽬前尚未⽀持。
Stop 停⽌。
StopImage ⽬前尚未⽀持。
StrikeThrough ⽬前尚未⽀持。
Subscript ⽬前尚未⽀持。
Superscript ⽬前尚未⽀持。
UnBookmark 从当前选中区中删除全部书签。
Underline 切换当前选中区的下划线显⽰与否。
Undo 撤消。
Unlink 从当前选中区中删除全部超级链接。
Unselect 清除当前选中区的选中状态。
2.[object HTMLTableCellElement] 是什么？？？=========
[object HTMLTableCellElement] 这个对象就相当于getDocumentElementById(“”)获取到的内容，可以直接使⽤JQ进⾏dom与jq对象之间的转换，然后就是正常的操作步骤去操作
完整代码
table注册单元格点击事件
@cell-click="clickMessage"//在table组件中
clickMessage⽅法
clickMessage(row, column, cell){
if(column.property =='messageContent'){//根据prop判断点击⼀⾏的哪⼀个单元格
let content =$(cell);//[object HTMLTableCellElement] 转jq对象    ==== cell =>dom对象
thispoment = content.children()[0].innerHTML;//获取到单元格的⽂本内容
}
},
template代码，加⼊展⽰获取的⽂本dom以及复制按钮
<el-input type="textarea"v-model="compoment":rows="8"id="copytext"></el-input>
<el-button type="success"@click="copyMessage">复制</el-button>
copyMessage⽅法
copyMessage(){
let dom = ElementById('copytext');//获取要复制的⽂本dom
dom.select();//选中
this.$notify({
message:'复制成功'
});
},
这⾥就实现了点击表格单元格获取单元格内容，取出innerHTML，并在dom中显⽰的功能。主要问题，在获取到[object HTMLTableCellElement]时有点蒙蔽，⽹上到⼀些相关资料，可以把它理解为相当于getDocumentElementById(“”)获取到的内容。然后就简单了
更新
上⾯是必须要⽂本内容，及html标签为input，再添加⼀个其他html标签的复制内容⽅法，如span <span id="copytext"> {{ compoment }} </span>
copy(){
let dom = ElementById('copytext');
let g = Selection();
let d = ateRange();
d.selectNodeContents(dom);
g.addRange(d);
this.$notify({
message:'复制成功'
});
},
基本上处理⼀直，只是在选中dom时有所不同，看⼤佬这样⽤的~~~

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。