首先我是个刚转入前端没几天菜鸟,今天第一个感触,前端真是太深奥了!原来前端的东西这么多!
<embed id="svgEle" src="svg/svg2.svg" style="width: 100%; height: 99%;" type="image/svg+xml"/>
var svgEle = document.getElementById("svgEle");//获得svgEle标签对象
var svgDoc = svgEle.getSVGDocument();//获得svg的document对象var element = svgDoc.getElementById("id");//id指svg2文件里 子标签的ID是id的标签对象通过这样可以获取svg里面子标签对象来进行一些操作。这是今天第一个掌握的知识点,还有创建svg文件的表头格式
<svg xmlns="http://www.w3.org/2000/svg" version="1.2" baseProfile="tiny" width="100%" height="100%"></svg>在这里面加入相应的标签,就可以生成相应的svg文件,然后可以通过html的img标签、object标签、iframe标签、embed标签将svg文件导入html。data-#在标签使用这个属性可以自定义一些值,作为传参用,然后通过
event.currentTarget.getAttributeNS(null,"data-jump");然后通过这种方式可以获取到对应的参数,这种方式可以自由的定义属性,来操作页面的逻辑问题
console.log("点击了第"+svgIndex+"座楼");这个方式可以把参数打印到页面的控制台,ctrl+shift+J,弹出的页面选择console,可以看到打印的参数
emDom=document.getElementById(targetID);var svgStr=emDom.getAttribute("src");
这种方式可以获得标签中对应标签的字符串
var aa=svgDoc.getElementById("text1");aa.innerHTML="123";innerHTML是编辑重置内部html的属性,例如alert(document.getElementById("test").innerHTML);<div id = "test"><a>aaaa</a></div>最后输出的结果是<a>aaaa</a>========================================
$("#root").empty().append("<embed id=‘svgRoot‘ src=‘"+url+"‘ width=‘100%‘ height=‘99%‘type=‘image/svg+xml‘ onload=‘svgControl.loadSvg()‘></embed>");empty()重置root里面的内容,append()向root里面添加内容
JSON.parse(desc.innerHTML);这是将json文件转换为json对象 今天掌握的知识点就这些了,累死了,睡觉,明天还要工作,工作中继续学习。
时间: 2024-09-30 18:45:39