2012-03-05 18 views
5

के साथ एचटीएमएल स्रोत कोड से संबंधित चयनित एचटीएमएल तत्व ऑफसेट प्राप्त करना एचटीएमएल स्रोत कोड में एक चयनित एचटीएमएल तत्व का ऑफसेट प्राप्त कर सकता है?जेएस

उदाहरण के लिए

:

<html> <body> <a href="http://google.com">google</a> </body> <html>

यदि उपयोगकर्ता गूगल पाठ का चयन होता है, मैं 40 इस के रूप में प्राप्त करना चाहते हैं स्रोत की शुरुआत से ऑफसेट है।

मैंने रेंज ऑब्जेक्ट के साथ प्रयास किया लेकिन इस के साथ कुछ उपयोगी नहीं मिला।

धन्यवाद!

+0

'एचटीएमएल स्रोत कोड में' से आपका क्या मतलब है? –

+1

आपको इस नंबर की आवश्यकता क्यों है? –

उत्तर

1
<html> 
<head> 
<script> 
function srcOffset(ele) 
{ 
    alert(document.getElementsByTagName('html')[0].innerHTML.indexOf(ele.id) + ele.id.length + 2); 
    return false; 
} 
</script> 
</head> 
<body> 
<a href="http://www.google.com/" onclick="return srcOffset(this)" id="myLink">Google</a> 
</body> 
</html> 
+0

आपके उत्तर के लिए धन्यवाद, लेकिन क्या होगा यदि तत्व में आईडी attr नहीं है? –

+0

एंकर के बारे में कुछ अद्वितीय होना चाहिए, या आप कभी भी यह बताने में सक्षम नहीं होंगे कि स्रोत में कौन सा लिंक जेएस कहलाता है। यदि आप सुनिश्चित हैं कि पृष्ठ पर यह अद्वितीय है और इसके बाद बंद ब्रैकेट की खोज करें तो आप href विशेषता का उपयोग कर सकते हैं। विशिष्टता के बिना, आप बोनड हैं। – MarkFisher

+0

ठीक है मैं एंकर नोड को आईडी एट्री इंजेक्ट करने की कोशिश करूंगा और इस प्रकार वांछित तत्व के लिए विशिष्टता प्राप्त करूंगा। उम्मीद है कि यह चाल करेगा। एक बार फिर धन्यवाद। –

-1

यह कैसे आप jQuery

इस उदाहरण के
$(document).ready(function() { 
    $("a").click(function() { 
    var offset = $(this).offset(); 
    alert(offset.left); 
     alert(offset.top); 
}); 

});​ 

<html> <body> 
    <a href="http://google.com" class="first">google</a> 
    <a href="http://abc.com" class="second">abc</a> 
    <a href="http://xyz.com" class="third">xyz</a> 
</body> <html>​ 

a.first { position:absolute; 
    left:20px; top:35px; } 
a.second{ position:absolute; 
      left:100px; top:35px; } 
a.third{ position:absolute; 
      left:220px; top:35px; } 

डेमो का उपयोग कर भरपाई हो: http://jsfiddle.net/5YFxH/

+1

त्वरित उत्तर के लिए धन्यवाद, लेकिन यह मेरा मतलब नहीं था। मुझे पता है कि तत्व को कैसे व्यवस्थित करना है। लेकिन मुझे एचटीएमएल कोड में ऑफसेट की जरूरत है। एचटीएमएल स्रोत कोड की शुरुआत से वर्णों की संख्या। क्षमा करें अगर मैं स्पष्ट नहीं था। इस के लिए कोई विचार है? –

1

आप वास्तव में एक समझदार रास्ते में ऐसा नहीं कर सकते। मौलिक समस्या यह है कि सर्वर द्वारा भेजे गए मूल HTML को वापस पाने के लिए ब्राउज़र में कोई रास्ता नहीं है; innerHTML अक्सर किसी भी तरह से भिन्न होता है क्योंकि यह मूल HTML के स्निपेट की बजाय मूल HTML से पार्स किए गए ब्राउज़र के DOM का प्रतिनिधित्व करता है।

सभी प्रमुख ब्राउज़रों में उपयोगकर्ता के चयन के बारे में जानकारी पुनर्प्राप्त करना संभव है लेकिन यह जानकारी सर्वर द्वारा भेजे गए मूल HTML वाले स्ट्रिंग के सापेक्ष ऑफ़सेट के बजाय ब्राउज़र के डोम में नोड्स के संदर्भ में व्यक्त की जाती है।

यह सब मामला है, आपका सबसे अच्छा विकल्प अजाक्स के माध्यम से फिर से HTML स्रोत को पुनर्प्राप्त कर रहा है और ब्राउज़र से मेल खाने के लिए जटिल HTML पार्सिंग कर रहा है, जो आपकी HTML स्ट्रिंग के साथ डोम अप करता है, जो गैर-तुच्छ है। यह तब भी असंभव हो सकता है जब आपके पृष्ठ में चल रही स्क्रिप्ट ने HTML स्रोत को वापस प्राप्त करते समय DOM को संशोधित किया हो। मैं सुझाव दूंगा कि आप जो चाहते हैं उसे प्राप्त करने के लिए एक और तरीका ढूंढने का प्रयास करें।

+0

मुझे जो चाहिए वह हासिल करने का एक और तरीका मिला। आपके उत्तर के लिए बहुत - बहुत धन्यवाद! –